ES-6 JavaScript: Important Hacks About ES6 Block Bindings & Function

ES6 JavaScript Development from scratch. Get practice with live examples and learn exactly where to apply ES6 features.

1.>>Spread Operator

Even though we get the content on one array inside the other one, but actually it is an array inside another array which is definitely what we didn’t want. If we want the content to be inside a single array we can make use of the spread operator

// expand using spread operator

let arr = ['a','b'];

let arr2 = [...arr,'c','d'];

console.log(arr2); // [ 'a', 'b', 'c', 'd' ]

// output: >(4)[“a”, ”B”, “c”, “d”]

2.>>Arrow Functions

In ES6 we can write funtion in sorter way that is named arrow function . It is also more easier to read and write rather than normal function calling. For example-

//have no parameter
const give5 = () => 5;//have single parameter
const doubleIt = num => num * 2;// have multiple parameter
const add = (x, y) => x + y;
console.log(add(20, 10)); // 30

3.>>Arrow Function with Parameters

If you require to pass more than one parameter by using an arrow function, then you have to pass them within the parentheses.

For example:

var show = (a,b,c) => {

console.log(a + “ “ + b + “ “ + c );

}

show(100,200,300);

//Output:100 200 300

4.>>Default parameters

If a function in JavaScript is called with missing arguments, the missing values are set to undefine.

function muiliplay (a,b) {

return a*b

}

multiplay(5,2) //10

multiplay (5) //NaN!

5.>>Working with Unnamed Parameters

A pattern in some javaScript libraries is to be able to pass any number of parameters to a function.In JavaScript earlier version, there was no possibility to use unnamed parameter into the function, but ES6 introduces the rest parameter to make it easier to work with unnamed parameters.
The rest parameter allows any number of arguments as an array.

function (param1)

function (param1, param2,param3)

function (param1, param2)

6.>>Block-Level Functions

ES6 has tons of new language features and programming in the next version of JavaScript is a lot of fun. In particular, ES6 supports block-level functions, so the following code should produce the error “do Something is not defined”.

Block-level functions declarations are allowed in ES6.

They hoist to the top of the block.

In strict mode, they aren’t visible outside the containing block.

7.>>Variable and Function Hoisting

Variable declaration will applicable if the variable is hoisted on the top of the function or it will be treated global scope if they are declared outside a function. Example-

console.log(salary);

var salary ='$100'

console.log(salary);

//console: undefined

“$100”

8.>>Block-Level Declarations

Block-level declarations means the declare variable are not accessible outside the block scope Block scopes are created:

  1. Inside of a function
  2. Inside of a block (indicated by the { and } characters

9.>>Block Binding in Loops

In JavaScript, most often case developers want block level scoping of variables is within for loops. For for this we have to use let not var, cause var is being hoisted. Follow the two examples below

for (var i=0; i < 10; i++) {
process(items[i]);
}

// i is still accessible here
console.log(i); // 10

10.>>Global Block Bindings

We know, let and const are different from var. When var is used in the global scope, a new property is added to the global object (window in browsers). That means you can overwrite an existing global using var, example-

// in a browser
var greeting = ‘Hello, Bangladesh’;
console.log(window.greeting); // Hello, Bangladeshvar person = ‘Hello there’;
console.log(window.person); // Hello there

Thank you …..

--

--

Nishat Ahmed ::::: Programming Zone

I am Dewan Nishat Ahmed from Dhaka, Bangladesh . I am a Web Developer and content writter & Blogger.