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 – 5^10 or 7^12
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.
