9 features in ES6 that JavaScript programmers know

ES6 brings a lot of great features to Javascript. In this article, let’s explore the features that can help us write code more efficiently. The article is for people who are learning JS like me.

ECMAScript, or ES6, was published in June 2015. It was later renamed ECMAScript 2015.

1. Const and let

Before ES6, to declare variables we used the var keyword. However, it had a scope related problem. Since var has no block scope, this leads to unexpected situations, for example:

We will have problems in large projects with thousands of lines of code, we don’t know the company was declared before, so if we re-declare the variable of the same name in the if statement, it will unfortunately lead to change the value of the company variable in global scope.

That’s why we’ll replace it with let and const , the above example should work properly like this:

Now, if you define the same variable name, then there is no problem because the company is in two different scopes.

2. Arrow function

Today, modern programming languages ​​all tend to simplify the way of writing but still fulfill the task. Arrow function was born to help make code more concise. Before the arrow function existed, we used to write the following:

With the arrow function:

3. The “Rest” parameter

Let’s see the following example:

As can be seen the … prefix of the last parameter will be stored in an array, numbers is called the rest parameter

4. Template literals

Template literals are strings that you can wrap and use with an interpolated expression, of type ${variable_name} . To create template literals we use a (instead of ” or “” as a regular string).

For example:

5. Promises

Promises allow you to pause a function until the previous functions have been executed, which is used when we are processing a sequence of actions in sequence. Without Promise, we use the callback but the callback has many limitations so no one likes to use it.

For example:

See more here:

• https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise
• https://www.digitalocean.com/community/tutorials/javascript-promises-for-dummies

6. Default parameter

Javascript defaults allow us to initialize a function’s input parameter if we call it without passing arguments or undefined.

For example if we don’t pass an argument to the sayGreeting function, it will be undefined

With ES6 we can set the default value for the input parameter like this:

7. Modules

When writing code, we usually have functions with a specific function / purpose, these related functions we separate … called a module. For example, we have a calculation module with addition and subtraction functions, for example:

We use the export keyword to “show” to other files that we can import for use, for example:

8. Destructuring

Take a look at the bottom example:

You can see that with the above user object and I want to create a variable to store each value in it, I have to rewrite the user. it takes time.

With destructuring we can do the following:

If we want to rename the variable name to username, we do the following:

Simpler, right. Destructuring allows us to extract parts of an object or array.

9. Class

Before ES6, JS had no class, so we used to use functions like this.

With ES6, we can write clearer, easier to understand for those who already know languages ​​like C #, Java …

There are also more cool features of ES6 such as Proxy, Symbol … you can learn more here https://github.com/lukehoban/es6features

The above are not all features of ES6, but just some of the features that are good and useful to me. If you know a good feature, then comment for me to learn more with the nhea.

Thank you for your time reading.

This source: https://medium.com/javascript-in-plain-english/9-es6-features-every-javascript-developer-should-know-b1f2915e7add