googleads
3 Must Known Features Of JavaScript ECMAScript 6 (ES6)
preloder
Javascript FrameWorks Web Development

3 Must Known Features Of JavaScript ECMAScript 6 (ES6)

ES6 got released in 2009 itself but many developers not aware of its fruitful features! Because when the JavaScript ECMAScript 6 (ES6) released, some browsers are not compatible with it so literally ES6 failed to reach its expected audience as the result, most of its fruitful features remained unfamiliar to some developers. But that’s not the case now, today most of the web browsers completely extending its supports and so much compatible to work with ES6.

On giving the close look of JavaScript ECMAScript 6 (ES6) and its features, today on this article, am planning to take you to the ride on most exciting features of ES6 in a succinct way. I believe that you will possess basic skills of and you be able to apply them in a real project after reading it. And, my personal words for you is, please don’t treat it as a guide or documentation. My goal is just to encourage you to dig deeper and get familiar with ES6.

ES6 brought a lot to the table which changed the way we write Javascript for better. Though there are a lot of changes happened, I consider 3 of them to be the most important additions to the language. I am not saying that the rest of the new features aren’t important but I would rather say these 3 are my personal favorite features.

1) Spread operator

The spread operator is the first wonderful addition that I love, it is denoted by three dots (…), Its used to spread iterables in places where one or more parameters are expected. It can be used in a variety of interesting way. A few examples are below.

i) Merging arrays

 

ii)Copying an array without reference

 

If we copy directly without using the spread then arrays will still have the reference, resulting both arrays having the newly added member.

iii) Destructuring objects

 

When destructuring, each property goes into the respective variables and the rest of the object will be going into the variable where the spread operator is used. Cool right?

2) Default parameters

We all remember the tricks we used to get default parameters in javascript, For example.

 

It is fine unless someone calls this function with a 0 value, It’ll evaluate to false and the default values will be set which is not intended. ES6 introduces us with default parameters which can be defined in the method signature like below.

 

No more dirty hacks are required to achieve this.

Related: Leveraging The Power Of Javascript Console In Development

 

3) Template Literals And Multi-line Strings

Template literals are interpolations in which how to output variables in strings. In ES5 we had to use the following method.

 

Luckily in ES6 things have become little easier for us, You can rewrite the same using the below,

 

In the above code, ${variable} name is the syntax for the template literals, the string will parse the variables and add the value to it. If you check closely you can see that the quotes around the string have changed into a pair of backticks(`), it is the new way to write strings in javascript and it has support for multi-line strings as well. For example,

 

In ES6 the above becomes like this,

 

Best To Read: Top 5 JavaScript IDEs In 2018

Sounds like am done with my points, above three are best from my favorite list of ES6, Please write on your other favorite features of ES6 in comment section and let the world know your favorite list too. 
Looking for more blogs to read? Then don’t miss out anything from our largest blog portal where you find the blogs from diverse technologies.

The following two tabs change content below.

Vignesh M

An energetic Senior Software Engineer has strong desire in Web development. With 5 years of experience in Angular, PHP, Hybrid app development he always strives to come up with the Smart Solutions to accomplish the complex tasks. Technologies apart, Ask him anything, be it Games, Bikes, Travel spots, Computers, Books, Politics or whatever He ll be mastering it all!

Leave a Reply

Your email address will not be published. Required fields are marked *

[contact-form-7 id="120788" title="Web Page Form"]

Schedule Your Call