Newer JavaScript Features

Sulegjan Sasikumar
4 min readFeb 22, 2021

It’s just a collection of modern, newer syntax improvements to JavaScript.Absolutely So these are useful.

  1. DEFAULT PARAMS
  2. SPREAD
  3. REST PARAMS
  4. DESTRUCTURING

1.DEFAULT PARAMS

firstly we’ll look at is default Pyramus or default parameters. when we write a function, we’ll have some parameters and it may be optional. If a user passes it in, we’ll use it. And if they don’t, we’d like to give it a default value.

this is an old multiply function that accepts a,b. if b is undefined or if we don’t give a value for b then b automatically fixed by default value 1.So this was the old way of doing things and it’s kind of annoying.

Now, the new way of doing it is using syntax improvement where we add an equal sign and a default value directly in our parameter list. This is easier to read, write and it’s just more compact. It’s a nicer alternative.

2.SPREAD

1.spread in function calls

spread is one of the newer features in JavaScript. this is the phrase expanding or just the word expanding. example

eerrtrtrtryrtyrtyrtytyt

nums array has four values(9,4,3,2).if we call the function (math.Max), we can’t get any value. because We passed in a single array of four values. It’s anticipating separate arguments, each one being a number. So we can do is use the spread syntax(…math.max), which is three dots, to spread this array into separate arguments. after we will get maximum values. this is the same as calling in math.max(9,3,2,8) method.

2.Create a new array using an existing array

we can use this method to compain spread arrays.

example:- array 1 :- const num1=[1,2,3,4]; array2:- const num2=[6,7,8,9];

calling method is […num1,…num2] ;

output : [1,2,3,4,6,7,8] this is an easy method .otherwise we have to type all these element.

3. spread in object literals.

we can Copies properties from one object into another object literal in this way.

const feline={ legs:4 , family:’felidae’ };

const canline= { family:’canine’ , furry:true}:

if we call

const dog = {…canine, ispet : true };

out put we will be this way

{ family:’’caninae’’ , furry:true, is pet:true }

this make one array into new array.we use method this lot of times.

3.REST PARAMS

this method uses for collects all remaining arguments into an actual array.

The rest operator, which contains three dots(…nums), goes in our parameter list and it collects all remaining arguments and puts them in an actual array.

if we use without three dots we get only one value (that does not sum).

another example:-

function examResults(grade A,grade B,…everyoneElse){

console.log(‘GRADE A GOES TO:${grade A}’)

console.log(‘GRADE B GOES TO:${grade B}’)

console.log(‘AND REATTEMPT TO EVERYONE ELSE::${grade B}’)

}

INPUTS:- examResults(‘tammy’, ‘toody’, ‘trevor’, ‘travis’)

OUTPUT:- GRADE A GOES TO:tammy

GRADE B GOES TO :toody

AND REATTEMPT TO EVERYONE ELSE:Trevor,Travis

4.DESTRUCTURING

  1. destructuring arrays

it’s a nice way of unpacking or extracting or singling out values from arrays or from objects.

Gold, silver, bronze equals race results. clearly, this example shows that how can destructing an array. we have to have square brackets. the array braces to indicate we are destructuring from an array.

we have three names here and we only extracted two into standalone variables. after we can get output this way.

2.object destructuring

Object destructuring is a useful JavaScript feature to extract properties from objects and bind them to variables. we’ll get the same results. It is also valid to assign variables to an object that hasn’t been declared. we have many types of object destructuring methods.

3. param Destructuring

this picture clearly shows the param destructuring method. The last use case for destruction. we’re defining a function, when we’re writing our parameters between those parentheses, we can destructure the values that are being passed in.

--

--