10 Essential Concept of ES6 and Functions in JavaScript

Hello..! May be you are an enthusiastic Javascript learner who already known about basic javascript. This is an article that explores your ES6 and function-related knowledge. So, let's started…

1. Block Binding:

Variable is more formally known as binding. When we declare and/or initialize a variable, we actually bind a value to a name inside a scope. Scope usually refers to a specific part of a program.

2. Hoisting:

ES6 brings a new feature called hoisting. In general, hoisting is a mechanism that handles execution contexts in JavaScript. This means the variable and function declarations (not initializations) are put into the memory during the compile phases before going for any execution.

3. Block Level Declaration:

If you declare a variable in a block-level scope using any of let and const you can not access the declaration outside that block scope. Block Scopes can be created in the following places:

  • Inside a block (wrapped with two curly { } braces)

4.Block Binding in Loops

Block level is very useful when dealing with loops in javascript. It is best practice to use let instead of var because var is being hoisted. consider the following example:

block-binding Loop

5.Global Block Bindings:

Global scope behavior for var is different than let and const. For example when var is used in the global scope, a new global variable is created, which is a property on the global object (window in browsers), but if you use let or const in the global scope, a new binding is created in the global scope but no property added to the global object (window in browsers). That mean for var you can accidentally overwrite an existing global, but if you use let or const you cannot overwrite. Here’s the example:

6. Emerging Best Practices for Block Bindings

At now we should know What is Best for for Block Bindings ??

Some Functional Concepts in ES6

7. Functions with Default Parameter Values

In ES5 and earlier requires lots of extra code to simulate default parameter value. ES6 make it easier to pass default parameter values when parameter is not formally passed when call the function. For example:

8. Block-Level Functions

ES6 allows block-level functions which are hoisted on top of the function or hoisted into the global scope.. For example:

9. Arrow Functions

ES6 allows an alternative way to write shorter syntax named arrow function compared to traditional function expression. For example:

10. Working with Unnamed Parameters

Earlier in javaScript function parameters that are passed without defining are inspect through argument object. Though inspecting arguments works fine in most of the cases, this object can be a little cumbersome to work with. 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.

JavaScript Developer | Front End development Expert | Writer | Dreamer & Curious Learner