JavaScript ES6 brings new syntax and new awesome features to make your code more modern and more readable. It allows you to write less code and do more. ES6 introduces us to many great features like arrow functions, template strings, class destruction, Modules… and more.
const and let
const is a new keyword in ES6 for declaring variables. const is more powerful than var. Once used, the variable can’t be reassigned. In other words, it’s an immutable variable except when it used with objects.
Arrow functions
The arrow function is really awesome, and makes your code more readable, more structured, and look like modern code. The map function with arrows looks more clear and readable than map in ES5. With ES6 you can write shorter and smarter code. You can use the same with filter and reduce.
Template Literals
Template literals or template strings are pretty cool. We don’t have to use the plus (+) operator to concatenate strings, or when we want to use a variable inside a string.
Default parameters
So, when you forget to write the parameter, it won’t return an undefined error because the parameter is already defined in the default. So when you run your function with a missed parameter, it will take the value of the default parameter t, and it will not return an error!
Array and object destructing
Destruction makes the assignment of the values of an array or object to the new variable easier. With ES5, we have to assign each value to each variable. With ES6, we just put our values within curly brackets to get any property of the object.
Import and export
Using import and export in your JavaScript application makes it more powerful. They allow you to create separate and reusable components. It is simple! export allows you to export a module to be used in another JavaScript component. We use import to import that module to use it in our component.
Promises
Promises are a new feature of ES6. It’s a method to write asynchronous code. It can be used when, for example, we want to fetch data from an API, or when we have a function that takes time to be executed.
Rest parameter and Spread operator
The rest parameters are used to get the argument of an array, and return a new array. The spread operator has the same syntax as the rest parameter, but the spread operator takes the Array itself and not just the arguments. We can use the Spread parameter to get the values of an Array, instead of using a for loop or any other method.
Classes
Classes are the core of object oriented programming (OOP). They make your code more secure and encapsulated. Using classes gives your code a nice structure and keeps it oriented.
Modules
In ES5 you would use <script> tags with IIFE, or some library like AMD, while in ES6 you can expose your class with export.