default parameter in javascript

//ES5 

function person(name,age,profession){

    profession===undefined?profession="engineer":profession=profession;

    this.name = name;

    this.age = age;

    this.profession = profession;

}

var lokman = new person('lokman',32);//In javascript no need to provide all the parameter when a function                                                                 is called.

console.log(lokman);

//ES6

function person(name,age,profession='engineer'){

    this.name = name;

    this.age = age;

    this.profession = profession;

}

var lokman = new person('lokman',32);

Rest parameter in javascript

 Rest parameter is opposite of spread operator . In rest parameter function takes an argument list and transform it into an array .

--Spread operator is used in the function call.

--While rest parameter is used in function declaration .

lets see an example,

//ES5

function isFullAge(){

 var args=Array.prototype.slice.call(arguments);   //taking the arguments and converting into an array

  args.forEach(function(cur){

     console.log((2016-cur)>=18);

  });

}

isFullAge(1990,1995,2000);

//ES6

function isFullAge6(...args){ //no need to convert transform into an array .it automatically transformed                                                   using rest parameter.

    args.forEach(cur => console.log((2016-cur)>=18));

}

isFullAge6(1990,1995,2000);

Difference between splice() and slice() in javascript array

slice()- returns a shallow copy of a portion of given array .

ex:

var a=['j','u','r','g','e','n'];

console.log(a.slice(3,5));

output: ["g","e"]

splice() - returns the removed elements from an array . It effects the orginal array .

var a=['j','u','r','g','e','n'];

console.log(a.splice(3,5));

output:["g", "e", "n"]

orginal array:['j','u','r']

Spread operator in javascript

 Spread operator introduced in ES6.The syntax is three dot(...variable name). It expands the array into individual elements.We can use to insert any element into any position in a array .

ex:

const familyLokman=['lokman','muna','tutul'];

const familySohel=['sohel','ruma','imran'];

const familyBig=[...familyLokman,...familySohel];

console.log(familyBig);

here,familyLokman and familySohel is two array .No we want to merge it into one array then we can use spread operator. 

we can use spread operator for dom nodes too.

const h = document.querySelector('h1');//h1 is the dom element with no class name and id .only tag                                                                         name

const boxes=document.querySelector('.boxes');//boxes is the class name which return nodeslist

const all=[h,...boxes];//add all node to all array

Array.from(all).foreach(el=>//Array.from(all) converting node list into an array 

el.style.color='purple');

Arrays in javascript

 N.B- we can iterate an array using foreach and map in javascript like below-

var arrays = [1,2,3,4,5];

//foreach

arrays.forEach(function(cur){

    if(cur===1){

        break; //break and continue is illegal in foreach .

   }    console.log(cur);

});

//map

arrays.map(function(cur){

    if(cur===2){

        break;////break and continue is illegal in map.

    }

    console.log(cur);

});

so the solution is to use regular for loop-

//ES5

for(var i=0;i<arrays.length;i++){

    if(i===3){

        break;

    }

    console.log(arrays[i]);

}

//ES6

const arrays = [7,1,2,3,4,5];

for(const cur of arrays){

    if(cur===3){

        continue;

    }

    console.log(cur);

}

we can use for--of loop to iterate easily over an array in ES6.

Destructuring practical example.

When we need to return multiple values from  a function we can return a object of having the values .But using destructure we can do this . lets see the example,

function calculateRetirement(year){

    const age = new Date().getFullYear()-year;

    return[age, 65-age];

}

const[age,retirement]=calculateRetirement(1989);

console.log(`age${age} retirement${retirement}`);

Destructuring in javascript

 Destructuring:  Destructuring is the process of extract data from a data structure .

lets see an example,

//ES5

var data = ['lokman',1989];

console.log(`data ${data}`);

var name=data[0];

var yearOfBirth=data[1];

console.log(`name=${name} year of birth=${yearOfBirth}`);

Here, we need two variable to extract data from the 'data' data structure  in es5.

But we can do this by using destructuring in es6.

const [name,yearOfBirth]=['lokman',1989];

console.log(name);

console.log(yearOfBirth);

here ,name and yearOfBirth will be two variable to store data from the array .

We can extra properties from object using destructure. let's do that,

const obj={

    firstName: 'lokman',

    lastName:'hossain'

}

const { firstName,lastName}=obj;

console.log(`first Name:${firstName} last Name:${lastName}`);

N.B:here property name should be same as in object .

What to do if we don't want to match property name as in object .

const {firstName:a,lastName:b}=obj;

console.log(`first name:${a} last name:${lastName}`);

we just define alias of the property name which will be the new const variable.