JS Versions
In this page:
What 'ECMAScript' Means
JavaScript is the language most people use the name for, but ECMAScript is the actual official specification that defines what JavaScript must do -- version names like ES5, ES6, and ES2015 all refer to specific releases of that specification, which browser vendors then implement.
Note: When you see "ES6" and "ES2015" used interchangeably, know that they refer to the exact same release -- ES6 is simply the older naming convention.
Warning: Not every browser implements every part of a given ECMAScript version at the exact same time -- checking actual browser support (rather than assuming based on the spec release date) matters for anything cutting-edge.
Example: What 'ECMAScript' Means
console.log("ES6", "ES2015"); // same release, two common names
The Major Milestones: ES5 and ES6
ES5 (2009) standardized foundational features like strict mode and array methods (forEach, map, filter). ES6/ES2015 was a much larger release, introducing let/const, arrow functions, classes, template literals, destructuring, promises, and modules -- changes significant enough that 'writing modern JavaScript' generally means writing ES6-style code.
Note: Recognize ES6 as the release that most reshaped everyday JavaScript syntax -- most "modern JavaScript" guides and style conventions assume at least ES6 as a baseline.
Warning: Code written entirely in pre-ES6 style (var, function expressions instead of arrow functions, no destructuring) is not wrong, but reads noticeably differently from most current tutorials and codebases.
Example: The Major Milestones: ES5 and ES6
[1, 2, 3].forEach(n => console.log(n)); // ES5
const double = n => n * 2; // ES6/ES2015
console.log(double(5));
Yearly Releases Since ES6
Since ES6/ES2015, ECMAScript has shifted to a yearly release cadence -- ES2016 added the exponentiation operator (**) and Array.includes(), ES2017 added async/await, ES2020 added optional chaining and nullish coalescing, and so on -- each release adding smaller, more targeted features rather than a sweeping overhaul.
Note: Think of post-ES6 releases as steady, incremental additions rather than major rewrites -- each year adds useful new tools without fundamentally changing the language's shape.
Warning: Very recently released features can lag in browser support, especially in older or less commonly updated browsers -- checking actual current support remains worthwhile for the newest additions.
Example: Yearly Releases Since ES6
console.log(2 ** 3); // ES2016: exponentiation operator
console.log([1, 2].includes(2)); // ES2016: Array.includes()
// ES2017 added async/await, ES2020 added ?. and ??
Checking Browser Support for a Feature
Before relying on a specific JavaScript feature in production code meant for a broad audience, checking a compatibility reference (like the "Can I use" website or MDN's browser compatibility tables) confirms whether your target browsers actually support it, or whether a fallback or transpiler is needed.
Note: When targeting older browsers (or an unknown, broad audience), check a compatibility table for any feature newer than a few years old before relying on it directly.
Warning: Assuming a feature "must be supported by now" without checking is a common source of production bugs affecting users on older browsers or devices.
Example: Checking Browser Support for a Feature
console.log(typeof Array.prototype.at); // check support before relying on newer methods
Using Tools to Support Older Browsers
Transpilers (like Babel) convert modern JavaScript syntax into an older, more widely supported equivalent, and polyfills add missing built-in functions to older environments that lack them -- together, these tools let developers write modern code while still supporting audiences on older browsers.
Note: Reach for a transpiler/polyfill setup specifically when you have confirmed a real need to support browsers that lack native support for features you want to use.
Warning: Adding a full transpilation pipeline purely out of habit, without an actual known need to support older browsers, adds build complexity for no real benefit.
Example: Using Tools to Support Older Browsers
console.log("Babel transpiles modern syntax; core-js polyfills missing built-ins.");
- Assuming every JavaScript feature works in every browser, without checking whether the specific feature is old enough (or new enough) to be reliably supported in your target audience's browsers.
- Confusing JavaScript with ECMAScript -- ECMAScript is the official language specification JavaScript implements, and version names (ES5, ES6, ES2020) refer to that specification.
- Writing code that mixes very old patterns (like var-based scoping) with very new ones inconsistently, without a clear reason, making the codebase harder to read.
- ECMAScript is the official specification JavaScript implements; version numbers (ES5, ES6/ES2015, ES2016, and onward) refer to specific releases of that specification.
- ES5 (2009) and ES6/ES2015 are the two most significant releases, each introducing changes that reshaped how JavaScript is commonly written.
- Since ES6, new features have been released roughly yearly (ES2016, ES2017, and so on), each adding smaller, incremental capabilities.
Modern browsers support ES2015 (ES6) and most subsequent yearly releases natively; ES5 support is effectively universal across every browser still in active use.
Chapter Quiz — Complete all 9 topics to unlock
0/9 topics done
Complete these topics first: