10 important ES6 things that every JS programmer should know.

Block Bindings

1. Var declarations and Hoisting

function getFruit(condition) {if(condition){
var fruit = 'apple'
return fruit;
}
else{
return 'no fruit found here';
}
}
function getFruit(condition) {var fruit;
if(condition){
fruit = 'apple'
return fruit;
}
else{
return 'no fruit found here';
}
}

2. Block-level Declarations

function getFruit(condition) {if(condition){
letfruit = 'apple'
return fruit;
}
else{
return 'no fruit found here';
}
}
let result = getFruit(true);
console.log(result)

3. Block Binding in Loops

for(var i=0; i < 10; i++) {
//code
}
console.log(i)
//i is accessible here because we use var and var hoisted on the top and thats why it works outside of a block
//let see what happend when we use let keyword insead of varfor(let i=0; i< 10; i++) {
//code
}
console.log(i)
//i is not accessible here because let is not work inside a block

4. Global Block binding

//If you write the following code in browser console thenvar intro = 'Hey dude. I am JS Programmer';
console.log(window.intro)
//Expected Output: Hey dude. I am JS Programmer
let intro = 'Hey dude. I am JS Programmer';
console.log(intro)
//Expected output: Hey dude. I am JS Programmer
console.log(window.intro)
//Output: undifined
console.log(intro === window.intro)
//Output: false

5. Emerging Best practice for block bindings

Function In ES6

6. Function With Default Parameter values

function add(num1,num2=0){
return num1+num2
}
const sum1 = add(30,50);
const sum2 = add(30);
console.log('sum1 = ',sum1)
//output:sum1 = 80
console.log('sum2 = ',sum2)
//output: sum2 = 30

7. Working With unnamed parameter

function Number(...args) => console.log(args);Number(10);       //output: 10
Number(20,30); //output: 20,30
Number(30,40,50); //output: 30,40,50

8. Spread Operator

const num = [10,20,30];
console.log(Math.min(...num)) //10
//another programconst arr1 = [30,40,50]
const arr2 = [60,70,80]
const allNumbers = (20, ...arr1, ...arr2, 90);
console.log(allNumbers)
//20,30,40,50,60,70,80,90

9. Block level Function

if(true) {
console.log(typeof getFruit) // function
function getFruit(){
//code
}
getFruit()
}
console.log(typeof getFruit) //function

10. Arrow Function

//normal function
function add(num1, num2) {
const sum = num1 + num2;
return sum;
}
add(10,20);
//arrow function
const add(num1, num2) => {
const sum = num1 + num2;
return sum;
}
add(10,20);

--

--

--

Jr. Web Developer || Curious JavaScript Programmer

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

How we implemented feature flagging with Split.io

Shining Some Light on Photo Resistors

What to do when you want to completely remove a certain version of gcc library

A thing or two about Objects in JavaScript.

What is hoisting in JavaScript?

Functions in ES6

How to Build a Card Match Up Game using React

Best frontend frameworks for web Development

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Md. Iqbal Ahmed

Md. Iqbal Ahmed

Jr. Web Developer || Curious JavaScript Programmer

More from Medium

Why is my thread constantly tangling in my embroidery machine? - 5 Simple Fixes

How to become an IOT Specialist

Tachyon 8 — a strategy to speed up your problem-solving process

One year already?