×
☰ See All Chapters

JavaScript ES6 Tutorial

ES stands for ECMAScript. JavaScript is considered the Language which implements a standard called ECMAScript. JavaScript is an implementation of ECMAScript. JavaScript you know and use in the browser today has implemented ES5 (ECMAScript 5). JavaScript ES5 does not require a build step (transpilers) to transform it into something that will run in today's browsers. JavaScript ES5 is fully supported by all todays’ browsers.

ES6 (ECMAScript 6 or ES2015 or ECMAScript 2015) ES2015 is a new version of the ECMAScript. JavaScript has also implemented ES6 which is called JavaScript ES6.  JavaScript ES6 is almost fully supported by all major browsers. But it will be some time until older versions of web browsers are phased out of use. For instance, Internet Explorer 11 does not support ES6, but has about 12% of the browser market share. In order to reap the benefits of ES6 today, we have to do a few things to get it to work in as many browsers as we can:

  1. We have to transpile our code so that a wider range of browsers understand our JavaScript. This means converting ES6 JavaScript into ES5 JavaScript.  Most of such transpilers are node based, so that's one of the reasons Node.js is often used. 

  2. We have to include a shim or polyfill that provides additional functionality added in ES6 that a browser may or may not have. 

Timeline of JavaScript, ECMAScript, TypeScript, Angular, ReactJS and related technologies

Year

Technology/Product

1990

Netscape browser and HTML

1995

Netscape 2.0 released, provides support for Javascript coding.

1996

Internet Explorer 3.0 released provides support for Jscript coding.

1997

ECMAScript, a combined aspects of JavaScript and JScript specification from European Computer Manufacturers Association (ECMA) to resolve conflict between Javascript and Jscript

1998

ECMAScript 2

1999

ECMAScript 3

2009

ECMAScript 5

2009

AngularJS 1.0 usually referred to as “Angular.js” or “AngularJS”

2012

TypeScript 1.0 was released as a superset of ECMAScript 5 by Microsoft

2013

ReactJS Initial Public Release

2015

ECMAScript 6 (ECMAScript  2015, ES6, ES 2015)

2016

ECMAScript 7 (ECMAScript 2016,  ES7,  ES 2016)

TypeScript 2.0 was released as a superset of ECMAScript 6

Google released Angular 2.0 based on TypeScript

2017

Google released Angular 4.0 on 23rd  March 2017

Google released Angular 5.0 on 1st  Nov, 2017

2018

Google released Angular 6.0 on 4th May, 2018

Google released Angular 7.0 on 18th October, 2018

2019

Google released Angular 8.0 on 28th May, 2019

2020

Google released Angular 9.0 on 06th Feb, 2020

Google released Angular 10.0 on 24th Jun, 2020

javascript-es6-tutorial-0

ECMAScript (ES)

  • ECMAScript is a Standard for scripting languages. 

  • Languages like Javascript are based on the ECMAScript standard. 

  • ECMA Standard is based on several originating technologies, the most well-known being JavaScript (Netscape) and Jscript (Microsoft). 

  • ECMA means European Computer Manufacturer’s Association 

JavaScript(JS)

  • JavaScript is the most popular implementation of the ECMAScript Standard. 

  • The core features of Javascript are based on the ECMAScript standard, but Javascript also has other additional features that are not in the ECMA specifications/standard. 

  • ActionScript and JScript are other languages that implement the ECMAScript. 

  • JavaScript was submitted to ECMA for standardization but due to trademark issues with the name Javascript the standard became called ECMAScript. 

  • Every browser has a JavaScript interpreter. 

ES5 (ECMAScript 5)

  • ES5 is a version of the ECMAScript (old/current one). 

  • ES5 is the standard for JavaScript you know and use in the browser today. 

  • ES5 does not require a build step (transpilers) to transform it into something that will run in today's browsers. 

  • ECMAScript version 5 was finished in December 2009, the latest versions of all major browsers (Chrome, Safari, Firefox, and IE) have implemented version 5. 

  • Version 5.1 was finished in June, 2011. 

ES6 (ECMAScript 6 or ES2015 or ECMAScript 2015)

  • ES2015 is a version of the ECMAScript (new/future one). 

  • Officially the name ES2015 should be used instead of ES6. 

  • ES6 will tackle many of the core language shortcomings addressed in TypeScript and CoffeeScript. 

  • ES6 is the next iteration of JavaScript, but it does not run in today's browsers. 

  • There are quite a few transpilers like BabelJS that will export ES5 for running in browsers. 

BabelJS

  • BabelJS is the most popular transpiler that transforms new JavaScript ES6 to Old JavaScript ES5. 

  • BabelJS makes it possible for writing the next generation of JavaScript today (means ES2015). 

  • BabelJS simply takes ES2015 file and transform it into ES5 file. 

  • Current browsers versions can now understand the new JavaScript code (ES2015), even if they don't yet support it. 


All Chapters
Author