Arrow Functions: An arrow function expression is a compact alternative to a traditional function expression.

Arrow functions, the basics

There’s another very simple and concise syntax for creating functions, that’s often better than Function Expressions.

It’s called “arrow functions”, because it looks like this:

let func = (arg1, arg2, ..., argN) => expression;

This creates a function func that accepts arguments arg1..argN, then evaluates the expression on the right side with their use and returns its result.

https://javascript.info/arrow-functions-basics

Let/var/const variables: Understand the difference between them, uses and their respective scopes.

A lot of shiny new features came out with ES2015 (ES6). And now, since it’s 2020, it’s assumed that a lot of JavaScript developers have become familiar with and have started using these features.

While this assumption might be partially true, it’s still possible that some of these features remain a mystery to some devs.

One of the features that came with ES6 is the addition of let and const, which can be used for variable declaration. The question is, what makes them different from good ol’ var which we’ve been using? If you are still not clear about this, then this article is for you.

In this article, we’ll discuss var, let and const with respect to their scope, use, and hoisting. As you read, take note of the differences between them that I’ll point out.

Var

Before the advent of ES6, var declarations ruled. There are issues associated with variables declared with var, though. That is why it was necessary for new ways to declare variables to emerge. First, let’s get to understand var more before we discuss those issues.

Let

let is now preferred for variable declaration. It’s no surprise as it comes as an improvement to var declarations. It also solves the problem with var that we just covered. Let’s consider why this is so.

Const

Variables declared with the const maintain constant values. const declarations share some similarities with let declarations.

https://www.freecodecamp.org/news/var-let-and-const-whats-the-difference/

Destructuring assignment: JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into a bunch of variables.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

Template Literals: With ES6, a newer form of string called template literal was given, which consists of two backticks ` `.

Template literals are literals delimited with backticks (`), allowing embedded expressions called substitutions.

Untagged template literals result in strings, which makes them useful for string interpolation (and multiline strings, since unescaped newlines are allowed).
Tagged template literals call a function (the tag function) with an array of any text segments from the literal followed by arguments with the values of any substitutions, which is useful for DSLs.

Template literals are sometimes informally called template strings, but they aren’t string literals and can’t be used everywhere a string literal can be used. Also, a tagged template literal may not result in a string; it’s up to the tag function what it creates (if anything).

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

Using Fetch: The Fetch API provides a JavaScript interface for accessing and manipulating parts of the HTTP pipeline, such as requests and responses.

Using Fetch

The Fetch API provides a JavaScript interface for accessing and manipulating parts of the HTTP pipeline, such as requests and responses. It also provides a global `fetch()` method that provides an easy, logical way to fetch resources asynchronously across the network.

This kind of functionality was previously achieved using XMLHttpRequest. Fetch provides a better alternative that can be easily used by other technologies such as Service Workers. Fetch also provides a single logical place to define other HTTP-related concepts such as CORS and extensions to HTTP.

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

Import / Export: ES6 gave people ability to share code between their own JavaScript files as well as third-party libraries using ES modules.

https://javascript.info/import-export

credits to :

@swastika0015

https://twitter.com/swastika0015/status/1482706734498172935

JavaScript concepts you need to know before getting into React.