React Fundamentals

Question 1

Features of React

Answer 1

JSX

components

virtual DOM

DOM

one way data-binding

high performance

Question 2

JSX

Answer 2

syntax extension of Javascript used in React. Allows us to write HTML and JS in the same file. Web browsers cannot read JSX directly. They can only read regular JS objects. For a web browser to read a JSX file, the file must be transpiled into a regular JavaScript object via a transpiler like Babel

Question 3

components

Answer 3

splits user interface into independent reusable parts that can be processed separately

Question 4

virtual DOM

Answer 4

lightweight representation of the real DOM. When state changes, the virtual DOM changes only that object in the real DOM instead of re-rendering the entire DOM

Question 5

DOM

Answer 5

Document object model, an HTML document with a tree structure. Each branch leads to a node. Each node contains objects (Objects can be in JS not JSX)

Question 6

one way data-binding

Answer 6

Unidirectional flow . When data flows in one direction, it’s easier to debug errors and ID the root cause quickly

Question 7

high performance

Answer 7

react apps only re-render components that have state change instead of all components within a tree.

Question 8

useState

Question 9

useEffect

Question 10

useCallback

Question 11

useMemo

Question 12

Rules of hooks

Answer 12

Don’t call hooks inside loops, conditions or nested functions

Only call hooks from react functional components or custom hooks

Question 13

React hooks are internally implemented as a _____

Answer 13

queue

React hooks are internally implemented as a queue, which each hook represented as a book having the reference to the next one (linked list, anyone?). This is way react hooks relies on the order in which hooks are called, and why they must be called on the top level of our components.

Question 14

True or false;

On each render, React keeps a copy of the dependency array and compares it with the previous dependency array. Objects are compared by reference, not value

Answer 14

True

On each render, React keeps a copy of the dependency array and compares it with the previous dependency array. Objects are compared by reference, not value

Question 15

True or false

Sometimes it’s better to create a function in useEffect if it’s only being used inside of useEFfect. It prevents the function from being created each time the component that uses the context hook usecontext is created

Answer 15

True

Sometimes it’s better to create a function in useEffect if it’s only being used inside of useEFfect. It prevents the function from being created each time the component that uses the context hook usecontext is created