ECMAScript is a term commonly used by developers for coding standard but most of us don’t know how did it come into the picture and why do we need it?

Imagine a world without a set of rules for coding. Everyone would be writing their own codes, will have their own set of rules and when a new person enters the world of software development, he/she will never know which set of rules they need to follow. The situation will become chaotic!!

The same incident happened with Javascript. When Javascript was first created by Netscape then there was a war going on between all the browser vendors in the market. Microsoft implemented its own version of javascript in Internet Explorer and Mozilla implemented its own. Similarly, other browser vendors implemented their own versions.

All this created a huge problem for the developers. One version ran fine on Netscape but was a total waste on Internet Explorer or Firefox.

To solve the cross-browser compatibility, Javascript was standardized by the ECMA international and that’s the reason it got the name ECMAScript. All browsers eventually implemented ECMAScript (though it took a lot of time).

How is Javascript related to ECMAScript

JavaScript is actually the term most of the developers use for ECMAScript. Although there are other implementations available for ECMAScript like – JScript (Microsoft) and ActionScript (Adobe), but JavaScript has proven to be the best-known implementation of ECMAScript since it was first published.

Jeff Atwood (founder of Stack Overflow) coined the term “Atwood’s Law,” which states:

“Any application that can be written in JavaScript, will eventually be written in JavaScript. “

It’s more than ten years now, and Atwood’s statement still lingers on. JavaScript is continuing to gain more and more adoption. The “next generation” of Javascript is something known as ES6 (The 6th edition, officially known as ECMAScript 2015).

6th Edition – ECMAScript 2015

The 6th edition, officially known as ECMAScript 2015 is different because it introduces new syntax. Infact, a lot of new syntaxes.

Browser support for ES6 is still incomplete. However, we can still use ES6 features by using a pre-processor like Babel to cross-compile our JavaScript back to ES5 compatible code for older browsers, so there’s no reason to put off learning about it.

This update added arrow functions, promises, let and const, classes and modules and a lot of new features, but defines them semantically in the same terms as ECMAScript 5 strict mode. The complete list of new features can be found on http://es6-features.org

Some of the new features that are introduced in ES6 –

Default Parameters

We do not need to worry about parameters taking 0 or undefined value since we can define defaults in the parameters’ list now. This also saves the overhead of sending parameters to each function call when we wish to use the defaults.

Block-Scoped Let and Const

‘let’ is a new ’var’ which restricts the scope of the variable to a block instead of the whole function. With ‘const’, things are easier. It’s just an immutable entity, and at the same time block-scoped like let.

Template Literals

It determines the way to output or append variables in a string. Now we have a simple bash-like syntax that makes the code look prettier.

Multi-line Strings

When writing a multiple line string, ES6 save a lot of typing efforts by its new syntax that uses ‘backticks’.

Destructuring Assignment

It provides intuitive and flexible destructuring of Arrays and Objects into individual variables during assignment so we do not need to write extra code for the assignment task.

Arrow Functions

Arrows are shorthand for functions using the => syntax. They are syntactically similar to C#, Java 8 and CoffeeScript arrows. Arrows would make your ‘this’ behave properly, i.e., ‘this’ will have the same value as in the context of the parent function – it won’t mutate.

Promises

Promises provide the representation of a value that may be made asynchronously available in the future. We can also combine one or more promises into new promises without worrying about the order of the underlying asynchronous operations.

Classes

ES6 provides more intuitive, OOP-styled and boilerplate-free classes. These classes encourage the prototype-based object-oriented pattern which brings support for inheritance, constructors, static methods and more.

Modules

ES6 includes a built-in module system which provides support for exporting values from modules and importing values to modules within the javascript code and without polluting the global namespace.

Spread Operator

The spread operator is an interesting way to build new arrays based on the values of existing arrays. It can:

• Copy an array
• Concatenate arrays
• Insert new items into arrays

7th Edition – ECMAScript 2016

The 7th edition, officially known as ECMAScript 2016, was finalized in June 2016. New features include the exponentiation operator (**) and Array.prototype.includes.

Array.prototype.includes

The includes() method determines whether an array includes a certain element or not, returning true or false as accordingly.

Exponentiation Operator

The exponentiation operator works same as exponentiation in mathematics, it returns the result of raising first operand to the power second operand. For example – 510 or 712

Conclusion

There are a number of really great language-centric reasons to start writing your code in ES6 and ES7 now, but there isn’t enough room in a single blog post to enumerate them or go into the nuances of how they will make your life better.

The point isn’t “all the cool kids are doing it.”

The point is that “a large number of the top libraries used by developers to build applications these days are already written in ES6.”

In my next blog, I will be writing about ES2017 and ES.next features. So stay tuned!!