Basics
⇥ Variable Declaration
⇥ Variable Scope
⇥ Variable Hoisting
⇥ Functions
⇥ Arrow Functions
⇥ Callback Functions
⇥ Closure
⇥ Basic Operators
⇥ Array Literals
⇥ Object Literals
⇥ if, if...else
⇥ for, for...in, for...of, while, do...while
Array.prototype Methods
⇥ forEach()
⇥ map()
⇥ reduce()
⇥ flat()
⇥ flatMap()
⇥ find()
⇥ filter()
⇥ slice()
⇥ splice()
⇥ push()
⇥ pop()
⇥ shift()
⇥ unshift()
⇥ some()
⇥ every()
Array Destructuring
It's frequently used in hooks esp. useState()
Example:
⇥ const [fruits, setFruits] = useState([]);
Array Spread
There are so many use cases. One of the place where we frequently spread an array is adding/updating/removing an item from the state.
Example:
Add an item to the starting of Array
⇥ let newArray = [itemToAdd, ...oldArray]
Object Destructuring
⬒ Properties are passed as an object parameter to our function component.
⬓ We can destructure it and, specify only those properties that we are going to use.
Example:
function MyComponent({name, address}) {
}
Object Spread
We may spread an object to pass those to a child component.
Example:
function MyComponent({name, address, ...rest}) {
return
}
Template Literals
⇥ Untagged Template Literals
⇥ Tagged Template Literals
This one is used heavily in few styling libraries.
ES Modules
⇥ import
⇥ import {}
⇥ export
⇥ export default
Conclusion
⬖ Learning method varies from person to person.
⬘ Though it's not mandatory to have JS knowledge, you can learn both React and JS at the same time.
⬗ But for a smooth riding, it's advisable to have basic knowledge of JS before starting your React journey.
Top comments (3)
I would say, you do not need React for these points. These are independent and I suggest learning without any UI Framework at the beginning.
Great suggestion.
great content!.. but one could hardly call himself a react dev if one doesn't know these I say.