JavaScript Versions: ES5, ES6 (ES2015) and Beyond

JavaScript versions like ES5, ES6 (ES2015) and ES2025 are yearly updates to the language. Learn who makes them, what each version added and how to check browser support.

Who makes JavaScript? ECMAScript and TC39

JavaScript was created in 1995 at Netscape. So that every browser would run it the same way, the language was written down as an official standard called ECMAScript (often shortened to ES). The standard is kept by an organisation called Ecma International. "JavaScript" is the name everyone uses; "ECMAScript" is the name of the rule book.

The people who decide what goes into the rule book are a group called TC39 (Technical Committee 39). Its members come from browser makers, big tech companies and the wider community. Think of TC39 as the committee that writes the grammar book of a language, and the browsers as the schools that teach it.

New ideas go through stages from 0 to 4. Stage 0 is just an idea. Stage 4 means the feature is finished, tested in real browsers, and ready to join the next yearly version.

Why is it called ES6 and also ES2015?

For a long time, versions had numbers: ES3 (1999) and ES5 (2009). ES4 was abandoned. Then in 2015 came a huge update. People called it ES6, but the official name was ES2015. From then on, TC39 decided to release a smaller update every year and to name it after the year: ES2016, ES2017, and so on.

So "ES7" and "ES2016" are the same thing, but the year names are the official ones and the ones you should use. A new version is approved each June. When people say "modern JavaScript", they usually mean ES2015 and everything after it.

Note: The big jump was ES2015. Most things you learned in this course, such as let, const, arrow functions, classes, template literals and promises, arrived in that one version.

The most important features in each JavaScript version

This table lists the features you are most likely to use. You do not need to remember which year each one came from, but it helps when you read old code or check browser support.

Version	Year	Most important features
ES5	2009	"use strict", JSON.parse/JSON.stringify, forEach, map, filter, reduce, Object.keys
ES2015 (ES6)	2015	let/const, arrow functions, classes, template literals, destructuring, default parameters, spread ..., for...of, promises, modules (import/export), Map, Set
ES2016	2016	array.includes(), exponent operator **
ES2017	2017	async/await, Object.values(), Object.entries(), padStart()/padEnd()
ES2018	2018	Object rest/spread {...obj}, Promise.finally(), for await...of, named regex groups
ES2019	2019	flat(), flatMap(), Object.fromEntries(), trimStart()/trimEnd(), catch without (error)
ES2020	2020	Optional chaining ?., nullish coalescing ??, BigInt, Promise.allSettled(), globalThis, dynamic import()
ES2021	2021	replaceAll(), Promise.any(), ??= ||= &&=, numeric separators 1_000_000
ES2022	2022	at(), Object.hasOwn(), class fields, private #fields, top-level await in modules, error cause
ES2023	2023	toSorted(), toReversed(), toSpliced(), with(), findLast(), findLastIndex()
ES2024	2024	Object.groupBy(), Map.groupBy(), Promise.withResolvers(), regex v flag
ES2025	2025	Set methods (union, intersection, difference...), iterator helpers, Promise.try(), RegExp.escape(), JSON module imports

Here is the same small task written in ES5 style and in modern style, so you can see how much the language has changed:

// ES5 style (2009)
var products = [{ name: "Pen", price: 2 }, { name: "Book", price: 15 }];
var names = products.map(function (p) {
  return p.name + " costs $" + p.price;
});
console.log(names);
// Output: ["Pen costs $2", "Book costs $15"]

// Modern style (ES2015 and later)
const items = [{ name: "Pen", price: 2 }, { name: "Book", price: 15 }];
const labels = items.map(({ name, price }) => `${name} costs $${price}`);
console.log(labels);
// Output: ["Pen costs $2", "Book costs $15"]

The modern version uses const, an arrow function, destructuring and a template literal. All four came from ES2015.

And a few newer features in action. You can paste this into a current browser console:

const scores = [40, 90, 75, 60];
console.log(scores.toSorted((a, b) => a - b)); // Output: [40, 60, 75, 90] (ES2023)
console.log(scores);                           // Output: [40, 90, 75, 60] (original unchanged)
console.log(scores.at(-1));                    // Output: 60 (ES2022)

const frontend = new Set(["Ana", "Ben", "Cleo"]);
const backend = new Set(["Ben", "Dev"]);
console.log(frontend.intersection(backend));   // Output: Set(1) {'Ben'} (ES2025)
console.log(frontend.union(backend));          // Output: Set(4) {'Ana', 'Ben', 'Cleo', 'Dev'}

How to check browser support for a JavaScript feature

Modern browsers (Chrome, Edge, Firefox and Safari) update themselves automatically, so in 2026 they support everything up to ES2024 and nearly all of ES2025. Problems usually come from very new features or from old, un-updated devices.

To check a feature:

1. Open the feature's page on MDN Web Docs and scroll to the Browser compatibility table at the bottom. Green means supported.
2. Or search the feature on the "Can I use" website, which also shows how many users have a supporting browser.
3. In code, you can test for a feature before using it. This is called feature detection.

if (typeof Set.prototype.union === "function") {
  console.log("Set methods are supported");
} else {
  console.log("Use a fallback here");
}
// Output (in a 2026 browser): Set methods are supported

Tip: Search MDN for the exact method name, for example "Array toSorted MDN". The MDN JavaScript reference has a compatibility table on every page.

What is transpiling? Babel in brief

Sometimes you must support an older browser that does not understand new syntax. A transpiler is a tool that rewrites your modern code into older code that does the same thing. It is like a translator who turns modern slang into formal language that everyone understands.

The best-known transpiler is Babel. You write modern code, and Babel outputs older code:

// You write (ES2020):
const city = user?.address?.city ?? "Unknown";

// Babel can output something like (ES5):
var _user$address, _user$address$city;
var city = (_user$address$city = user === null || user === void 0 ? void 0 :
  (_user$address = user.address) === null || _user$address === void 0 ? void 0 :
  _user$address.city) !== null && _user$address$city !== void 0 ? _user$address$city : "Unknown";

You never edit the output; you only edit your own modern code. Transpiling changes syntax. Missing functions, like Object.groupBy, need a polyfill instead: a small piece of code that adds the missing function. Today, build tools such as Vite already handle this for you based on a list of browsers you want to support, so many projects never set up Babel by hand.

Practice exercise

Take this ES5 code and rewrite it in modern JavaScript: var user = { first: "Mia", last: "Lopez" }; var greeting = "Hello, " + user.first + " " + user.last + "!"; console.log(greeting);. Then write a feature detection check for Object.groupBy that logs whether it is available.

Hint: use const, destructuring (const { first, last } = user) and a template literal. For the check, test typeof Object.groupBy === "function".

Key takeaways

• ECMAScript is the official standard for JavaScript, and the TC39 committee decides what goes into it.
• ES6 and ES2015 are the same version; since then a new version comes out every year, named after the year.
• ES2015 was the biggest update, bringing let, const, arrow functions, classes, promises and modules.
• Check support in the MDN compatibility tables and use feature detection for very new features.
• Transpilers like Babel turn new syntax into old syntax; polyfills add missing functions.