React setState, checkAuth, & Everything in-between

Meredith Davis
2 min readOct 11, 2020

Blogpost 404

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

I learned how to import and use Routers into my React projects so that

How does hoisting work in JavaScript?

Hoisting is a JavaScript mechanism where variables and function declarations are moved to the top of their scope before code execution. Inevitably, this means that no matter where functions and variables are declared, they are moved to the top of their scope regardless of whether their scope is global or local.

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

setState is in React Async because while state is updated synchronously, props are not, so there is no reason to have it in React Sync if other objects won’t reflect this update until be re-rendered.

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

Dirty checking is slower than observables because we must poll the data at a regular interval and check all of the values in the data structure recursively. By comparison, setting a value on the state will signal to a listener that some state has changed, so React can simply listen for change events on the state and queue up re-rendering.

What is PureComponent? When to use PureComponent over Component?

The major difference between React.PureComponent and React.Component is PureComponent does a shallow comparison on state change. It means that when comparing scalar values it compares their values, but when comparing objects it compares only references. It helps to improve the performance of the app.

You should go for React.PureComponent when you can satisfy any of the below conditions.

  • State/Props should be an immutable object
  • State/Props should not have a hierarchy
  • You should call forceUpdate when data changes

What is a higher order component?

A higher-order component is a function that takes a component and returns a new component. Whereas a component transforms props into UI, a higher-order component transforms a component into another component.

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

The checkAuth() function should act as a middle ware to reference the database to see if there is a user with matching email and password credentials as what the user entered into the UI. The email and password should be store to the state of the for a more reliable comparison between the database and the front end. The method should allow the user to enter if there is a user with matching credentials, and deny access otherwise.

--

--

Meredith Davis
0 Followers

Former Kindergarten Teacher, now a student at Austin Code Academy learning Front Stack Web Development