10 interesting concepts of ES6

Hoisting :
Hoisting is an interesting feature of JavaScript.

Declaring and/or initializing a variable using var, let or const make sure of binding occurrence in JavaScript. But there are some confusion arises with the uses of these keywords. Consider the following example.

Here when we call the function passing the boolean value we can console log age. If the parameter is true then we get age as output for two times. That means “age” is accessible outside of the if block.

But what if we use let?

See the following example. If we use “let/const” in the “if” block it is not accessible outside of the block. As JavaScript does not hoist let and const declarations, we try to access “age” outside of if block we will get “ReferenceError: age is not defined”.

2.Default function parameters.

This helps to set and use the default value of a parameter if no value is passed. see the following example :

3.Arrow Functions

Arrow function allows short syntax to write the function without using the ‘function’ keyword which is simple and clean. For a simple function, we also don’t need to use the return keyword. Example:

// ES5
var sum = function(x, y) {
return x + y;
}

// ES6
const sum = (x, y) => x + y;

4.The Spread Operator:
The spread operator is effective to use when we need all elements of an array or object to be placed as the same without complexity.
Consider the following code.

5.JavaScript Classes

It is basically a template for javascript objects. Here the class keyword is used to create a class. Inside the class constructor() method is used.
It makes our life easy when we need to deal with tons of objects with the same pattern. This helps us when we are focusing on object-oriented programming.

6. Wants to access the indefinite number of arguments as an array? Here rest parameter (…) can be useful. See the following example

7. If you want to find the first matched Element from an array, find() method is here to help you.

const numbers = [4, 9, 16, 25, 29];

const firstMatch = numbers.find((number) => number > 18);

console.log(firstMatch);

8.Exponentiation Operator

The exponentiation operator (**) helps us get the result of mathematical power in a very convenient way.

let p = 3;

let q = p ** 2;

console.log(q);

output=9

9.If you want to know a value in present in an array, include() method is a lifesaver.

const numbers = [3, 45, 34, 56, 67, 78, 89];
numbers.includes(45); // is true

10.Another powerful feature us Template Literals
When to embed expressions within a string template literals help a lot. It also helps in the case of multi-line strings.

example:

const name = “Harry”;

console.log(`Hello world, my name is ${name}`);