8 Modern JavaScript Concepts You MUST Know Before Learning React

In today's video, we are looking at 8 JavaScript concepts that you must know before learning React.

Many developers, when they first start learning React, get confused about some of the new syntax that they haven't seen before in vanilla JavaScript. Concepts like arrow functions, map(), filter(), module exports, and many others can often make React seem like a completely different type of JavaScript.

But it's not. Much of it is just ES6 JavaScript.

In this video, I'll go over 8 JavaScript concepts, explain how it works, and even give an example within React for context.

Whether you are planning to learn JavaScript, tried to learn JavaScript and got confused, or you are just a developer looking for a refresher, I think you'll have a lot of fun.

RESOURCES

Timestamps
Intro - 0:00
Arrow Functions - 1:18
Module Exports - 2:41
Destructuring - 4:53
Spread Operator - 8:35
Nullish Coalescing Operator - 13:36
Map method - 15:36
Filter method - 18:35
Sets - 19:50

**** Get ONE FREE Month on Skillshare. Learn Anything (preferably code 😁) ****

**** I write regularly ****

**** FREE EBOOKS ****

LET'S CONNECT!

#reactjs #modernjavascript #javascript

** Some of the links in this description may be affiliate links that I may get a little cut of. Thank you.

[moutafatin]

The nullish coalescing operator returns the right side only when the left side is null or undefined else returns the left side.
example: session.user?.email ?? "Not Logged In"

[lemon_maho]

Thank you very much, I was learning react and these stuff were used a lot and I didn't really know what are they, I only saw how they work. Useful stuff

[bassam]

I usually have a hard time understanding concepts like this but my god was the that the best and simplest explanation video I’ve ever seen!

[Garross]

Great video, super good revision, thanks! I would just add that an important difference between an arrow function and a traditionally function is that the arrow function does hold its own this state, which help keep things like dealing with this much simpler. In other words the arrow function maintains the same this as in the scope above it.

[rawanBairouti]

Great Video! Very clean and easy to understand. Thank you!

[carlooos]

great video, i been learning and looking for people i can watch to keep reviewing and this pretty much made these concepts cement into my brain

[Isaac-zsoi]

phenomenal, great video! thank you for sharing your knowledge and experience with us! :)

[fpqbt]

The old styled function definition vs. the new styled arrow functions still have some major differences, like the auto env. binding. It's pretty important, especially in React.

[yadusolparterre]

Great video, thanks.
If I can allow myself some criticism: default exports does not mean that you are exporting only one object, it means that there is one thing among your exports that has no name. You can very well export both a default object and some other objects, as long as you name them.

[mohamudhussin]

I’m wondering, as a fronted ; i mostly use functions/conditions/and styling the page ...

But I use the other JavaScript method when I leetcooding etc. ; my question is what I’m missing here and why I’m forced to learn it if I’m Berle used it !!

[jlambert]

Is there any way to create mobile applications without React Native or a framework?

[ahmadnurahsan]

😩 its almost 1 month cuz i have to learn react but my js is so bad