Everything Flashcards
What are the possible ways to create objects in JavaScript
object constructor (var object = new Object() and object literalt (var object = {})
What is JSON?
JSON is a text-based data format following JavaScript object syntax. Used when you transfer data from back to front end. JSON.parse to convert string to object, and JSON.stringify to convert object to string.
What is the purpose of the array slice method
The slice() method returns the selected elements in an array as a new array object
What is the purpose of the array splice method
The splice() method is used either adds/removes items to/from an array, and then returns the removed item. One difference is splice modifies the original array.
What is the difference between == and === operators
JavaScript provides both strict(===, !==) and type-converting(==, !=) equality comparison. The strict operators take type of variable in consideration, while non-strict operators make type correction/conversion based upon values of variables.
What are arrow functions?
An arrow function is a shorter syntax for a function expression and does not have its own this, arguments, super, or new.target. These functions are best suited for non-method functions, and they cannot be used as constructors.
What is a higher order function
Higher-order function is a function that accepts another function as an argument or returns a function as a return value or both.
What is scope in javascript
Scope is the accessibility of variables, functions, and objects in some particular part of your code during runtime. In other words, scope determines the visibility of variables and other resources in areas of your code.
Difference between foreach and map?
Both are iterators but map returns a new array whereas forEach won’t. ForEach is good when you want to check each element. Also map can be chained because it returns something.
difference between var, let and const
var is function scoped meaning it’s only available where it is declared. It is also hoisted so it can be referenced before being initialized. var can be redeclared and updated. Let is block scoped meaning it’s only available within the curly brackets. Let can be updated but not redeclared. Let is hoisted to top but isn’t initialized. Const are similar to let in terms of being block scoped but where they differ is that they can’t be updated.
What is React?
React is a Javascript library created by Facebook. It’s component based and used to create single page applications. Single page applications only load the application code once. You stay on the same page and the Javascript changes/updates the html or DOM to display new things without speaking to the server.
What are the features of React?
Some features of React are, component architecture, one way data flow, UI library, and Virtual Dom.
In calling setState, when would you pick one method of calling this function over the other?
You would use a function to set state when you need the current state or props of your component to calculate the next state. It is the most reliable to use the prevState function so you prevent the use of stale state or an “old” version of state that isn’t the current state. If you are certain you have the most current state or don’t need to the current state to calculate your setState then you can pass an object instead of a function.
Is setState a synchronous or async call?
You can set state by directly passing in an object to set with, or create a function that will copy the current state and updates based on the changes you make to it in your function.
List some of the major advantages of React.
Reusable components, Virtual DOM, React Developer Tools, faster rendering.
What are the limitations of React?
React focus on the view part of MVC i.e. UI of the web application. So, to overcome these that to focus on other development we need other tooling set technologies.
What is JSX?
JSX is a syntax extention of Javascript. It produces react elements for the virtual DOM. It represents objects in memory.
What is the virtual DOM? Explain how it works within ReactJS.
The Virtual DOM is a lightweight representation of the DOM. It exists in memory but is never rendered, In React JSX tells the template compiler how to build in the virtual DOM tree. The Render() function creates the virtual DOM tree. When your app is updated (from things like setState) there will be two virtual DOM trees in memory. React will compare the two trees and compare the differences then reconcile them create a patch then render them to the real DOM. That way all the updates are batched and the DOM is only ever updated once in each update.
Why can’t browsers read JSX?
Browsers don’t have inherent implementation for the browsers engine to understand JSX objects. Because JSX objects aren’t JavaScript objects.
Explain the purpose of render() in React.
Rendering is the React engine process walking through the virtual DOM and collecting the current state, props, structure, desired changes in the UI, etc.
The render function in react is used to create and update the UI. It describes how the ui should look on the browser window. It is part of the component life cycle and isn’t user called. It returns on JSX element that contains the view hierarchy for the current component. Render is called when: the react component is first instantiated following the constructor call, or after an update to the components props, or after a setState call.
What is Props?
Props are properties of components in react. They are used to pass data from parent component to child. Props are read only therefor should not be changed by the child component.
What is a state in React and how is it used?
State is a plain JavaScript object used by React to represent an information about the component’s current situation. The difference is while a “normal” variable “disappears” when their function exits, the state variables are preserved by React. It is used to enables a component to keep track of changing information in between renders and for it to be dynamic and interactive.
How can you update the state of a component?
You update the state of a component by calling the setState function.
What is arrow function in React? How is it used?
When writing a class component, all of the functions that you write out will need to be bound to the constructor so that the ‘this’ keyword will behave in the appropriate manner to allow you properly render your data. With a standard function the definition of this is dependent on where the function is called, so you would normally need bind this to it in react to get the correct definition of this that we want. An arrow function doesn’t have it’s own definition of this so it inherits it from the constructor.
Differentiate between stateful and stateless components. Stateful vs Stateless Components React
In react a stateful component holds a piece of state. By contrast a stateless component does not have state. A stateful component is keeping track of changing data while a stateless component prints out what is given to them via props or always rendering the same thing.
What are the different phases of React component’s lifecycle?
There are three phases to a components life cycle: Mounting, Updating, and Unmounting.
Why should we not update the state directly
If you try to update the state directly then it won’t re-render the component. Instead use setState() method. It schedules an update to a component’s state object. When state changes, the component responds by re-rendering.
What is the difference between calling a promise and using a .then
vs using await
?
in .then() it runs through the entire function and then continues the execution before returning back to the .then when the promise is resolved. Whereas in await the function stops execution within the function scope until the promise is resolved
What is the Temporal Dead Zone
The Temporal Dead Zone is a behavior in JavaScript that occurs when declaring a variable with the let and const keywords, but not with var. In ECMAScript 6, accessing a let or const variable before its declaration (within its scope) causes a ReferenceError. The time span when that happens, between the creation of a variable’s binding and its declaration, is called the temporal dead zone.
What is memoization
Memoization is a programming technique which attempts to increase a function’s performance by caching its previously computed results. Each time a memoized function is called, its parameters are used to index the cache.