Awesome ES6 Features That you should know!

In this post we will go over some useful and interesting ECMAScript 6 (ES2015) features, a feature that makes it easy for developers familiar with object oriented programming to start using JavaScript.

const and let

This const and let. Mainly Both are important features and it’s highly recommended to use them instead of the old var to avoid hoisting problems..
The main differences between const and let is that const allows you to create constants, and let to do the same as var, but it avoids hoisting problems. As a best practice, always use const to handle with immutable data, because it uses less memory than using let. Take a look at this
example:

// creating a constant
const name = 10;
// creating a variable
let value = 5;
// you can't change the value of a constant
name = 5;
// this change is allowed for `let` variables
value = 10;
// creating a constant object
const obj = {};
// You can only change object's attribute
obj.a = 10;
// but you can't reassign new data here
obj = 100;

Template Strings

The template string is a powerful feature, which allows you to interpolate data inside a string in an elegant way.
If you need to interpolate data inside a string, you just need to use this syntax: ${data}.For better understanding Take a example below:

let firstName = "Devangi";
let lastName = "Ajay";

let text = `Welcome ${firstName} ${lastName} Zala!`;

console.log(text);

Arrow Functions

Arrow function is one of the features introduced in the ES6 version of JavaScript.By using the syntax sugar => we are creating a function that does not alter the this keyword and that does not create any special variables such as arguments.Arrow functions allow us to write shorter function syntax:

//It gets shorter! 
If the function has only one statement, and the statement returns a value, you can remove the brackets and the return keyword:
let myFunc = (a, b) => a * b;

// arrow-function
const compare = (a, b) => {
    if (a > b) {
        return a;
    } else {
        return b;
    }
};

Spread Operators

The Spread Operator basically converts an array into arguments, it is very useful when you need to break array values to send them as parameters for a function or object constructors.
The JavaScript spread operator (...) allows us to quickly copy all or part of an existing array or object into another array or object.
Example:

function add(a, b) => {
    return a + b
};

Now, to invoke this function using an array elements as arguments, you just need to use this syntax: ...array, for Example:

const values = [1, 2];
add(...values); // returns 3

Destructuring assignment

The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.
We may have an array or object that we are working with, but we only need some of the items contained in these.
Example:

const fruits = ['Apple', 'Banana', 'Guava'];

const [one, two, three] = fruits;

In this post you learned a little bit about some useful features from ES6 (ECMAScript 6).