JS411 — Class 8

1. Discuss in words something you learned in class today or this week.

This week we learned about Redux. It is a state management library that allows us to share state between components regardless of their proximity to other components. It creates a central store that is available throughout the entire app. We use mapStateToProps and mapDispatchToProps functions from Redux to inject state or dispatch functions into our components as props. They can then update the state using actions and reducers.

2. How does hoisting work in JavaScript?

Hoisting is where variables and function declarations are moved to the top of their scope before any code is executed. In ES6, when using the Let keyword, this would be within the block that they were declared in as opposed to a function that they would be declared in. Hoisting makes it possible to call a function before it is written in code.

3. Why is setState() in React Async instead of Sync?

setState() is async because it alters the state which causes re-rendering. This can slow down performance and potentially leave the browser unresponsive. It is async to provide a better UI experience and to have better performance.

4. How is the Virtual-DOM more efficient than Dirty checking?

Dirty checking checks all of the nodes in the DOM at regular intervals to see if anything has changed. This can be very expensive and cause performance issues. On the other hand, using the Virtual-DOM which is a copy of the real DOM, components can keep track of changes by listing for events and update the virtual DOM with those changes. React can then compare the virtual DOM with the real DOM and make changes to only the nodes that have been updated instead of re-rendering the entire real DOM.

5. What is PureComponent? When to use PureComponent over Component?

A pure component is one that will always return the same output if given the same input. The output will always be consistent. This should be used carefully because if used incorrectly it can break the app. Using the normal Component, anytime a parent or grandparent and so on re-render, the children and grandchildren and so on also re-render even if their state and props don’t change. This can affect performance. Using PureComponent, the component will only re-render if it’s own state and props update making it faster and better for performance.

6. What is a higher order component?

A higher order component takes in another component and returns a new component with additional functionality. This is common in Redx for example where the connect component is used.

7. Which (if there is) node library method could you use to solve the algorithm problem you solved last night in your pre-homework.

8. Which (if there is) node library method could you use to solve the algorithm problem you solved in class tonight?

9. How do you think you might use the checkAuth() function to actually verify a user’s email and password?