Different versions of Javascript and the role of ECMAScript specification

If you are not new to Javascript, you might have heard about ES5, ES6, etc.
For a beginner, this could be overwhelming and confusing about what to learn about Javascript and where to begin.
But don't worry.
This lesson will clarify all your doubts regarding the different versions of Javascript.
Different versions of Javascript
Javascript was invented in 1995 by Brendan Eich at Netscape.

Fast forward to 25+ years later, Javascript is still evolving with new features and capabilities.
The current version of Javascript is 12.
Here is a glimpse of the older versions of Javascript:
- ECMA-262 5.1 edition, June 2011 (ES5)
- ECMA-262, 6th edition, June 2015 (ES6 or ES2015)
- ECMA-262, 7th edition, June 2016 (ES7)
- ECMA-262, 8th edition, June 2017 (ES8)
- ECMA-262, 9th edition, June 2018 (ES9)
- ECMA-262, 10th edition, June 2019 (ES10)
- ECMA-262, 11th edition, June 2020 (ES11)
And, if you notice the above list, you are seeing a lot of ES.
ES stands for ECMAScript.

ECMA what?
ECMAScript, my friend. ECMAScript.
What is ECMAScript?
ECMAScript (ECMA-262) is a specification for creating programming languages like Javascript.
The ECMAScript specification is created and maintained by an organization called ECMA International.
Some people think that ECMAScript and Javascript are the same.
However, ECMAScript is more like a blueprint, and Javascript is the implementation of that blueprint.
Javascript programming language is the most popular implementation of ECMAScript.
JScript programming language is another implementation of ECMAScript but it is not the same as Javascript and it is not that popular too.

Okay! Why we are talking about specifications now?
It has a lot to do with how Javascript evolves day by day with new features and how we, as developers, write our Javascript code.
The role of web browser vendors like Mozilla (Creator of Firefox)
The thing is, ECMAScript is just a specification.
It just tells how a programming language like Javascript should work and what features it must have.
But ECMAScript doesn't tell how to implement a programming language.
In other words, ECMAScript provides guidelines and rules for creating a programming language like Javascript but it doesn't create the programming language by itself.
So, who implements those guidelines and rules?
Browser Vendors like Mozilla.
The browser vendors will collaborate with smart people like Brendan Eich and create a programming language like Javascript by following the ECMAScript specification.
As simple as that.
So, whenever ECMAScript updates its specification for the advances in the programming language, Browser Vendors update their Javascript engines to support the newer features.
And because the implementation is left to the individual browser vendors, the language features behave slightly differently on different browsers, leading to a mess sometimes.
The mess around the implementation of Javascript features by browser vendors.
Ever heard of browser incompatibilities when it comes to web development?
If you have done any amount of CSS coding, you might have come across browser-prefixes like these:
-webkit-transition: 0.3s all ease-in;
-moz-transition: 0.3s all ease-in;
Browser Vendor Prefixes to support CSS Transitions in the older versions of the browser
I always wondered why a particular Javascript feature only works in a particular browser but not the other browsers.
The thing is, only a few major browsers implement the Javascript features whenever ECMA Internation releases a new edition of the ECMAScript specification.
There is a bit of freedom involved here.
It is up to the browser vendors to decide whether they should implement a particular feature of Javascript.
For example, Mozilla Firefox might implement a particular Javascript feature faster than Google Chrome or vice-versa.
This kind of freedom results in feature incompatibility issues between various browsers.
For example, the ES6 specification introduced the "Modules" feature.

As you can see in the above image, at the time of writing this lesson, the "Modules" feature is implemented by the majority of the web browsers but "Opera Mini" and "Internet Explorer" browser doesn't support the feature at all.
So, the browser vendors do expect that the user will upgrade their browser to enjoy the new features of Javascript.
This is a messy assumption, though.
And this forces you to write specific Javascript code for specific browsers and specific versions of a particular.
This is why a Javascript library like jQuery exists.
And we will see why something like jQuery became popular in the next lesson.