JS411 — Class 4

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

This week I learned how to set state in functional components using useState and useEffect. The useEffect method is run when the component mounts and when it re-renders. You can use it to set the initial state of your application. If you only want it to run when the component first mounts you can pass an empty array as a second parameter which will tell React that the effect doesn’t depend on anything from props or state so it doesn’t need to run more than once. The useState function returns the current state and the function that will be used to update that state.

2. What is the difference between state and props?

Props are values passed down from a parent component. They can come from the parents state or from other values that were passed down to be used in the child component. State is the current state of the application and can be set and updated in any component.

3. What is ReactDOM? What is the difference between ReactDOM and React?

React is a Javascript library used to create user interfaces. ReactDOM is a package that provides DOM specific methods to manage DOM elements. ReactDOM allows React to interact with the DOM.

4. What is React.createClass?

Before ES6 Javascript didn’t have classes, so React created its own class system called React.createClass. After ES6 introduced classes it allowed the use of class based components using native Javascript instead of the custom classes created by React.

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

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

7. Explain event delegation in JavaScript and why it is useful.

If you have several elements that all need event listeners you need to attach an event listener to each of them separately. However, if those elements are siblings that share a parent, you can use event delegation to attach a single event listener to the parent instead of having to attach separate event listeners to each child. You then can use event.target to determine which of the children the event that was triggered came from.

8. Which new JavaScript / browser features are you most excited about and why?

The string.replaceAll method looks interesting. In the past, in order to update all instances of something within a string, you needed to use Regex to handle the replace. Now you can use this new method and it will find and replace all instances in a given string.