JavaScript from ES6 to Today
Tags: javascript, webdev, programming, es6
Published: 2021-09-20 22:04:16

ES6 is nearly synonymous with "modern javascript" and rightly so. When it dropped in 2015 as the second-ever major language update (first being ES5 in 2009) ES6 added a _huge_ list of features that completely changed JS development. But time didn't stop in 2015 and the good folks over at ECMA International have released a new version every year since - that's right, in 2021 we're actually on **ES12**!

If you missed the memo on versions 7-11, you're not alone. Thanks to tools like Babel, Webpack and TypeScript that transpile our code to browser-usable versions, we don't really need to pay much attention to the ES versions. But you might be surprised how many language features are newer - or older - than you thought...

## ES6 / ECMAScript 2015

### Variables

- `let`
- `const`
- Block-scoping
- Array destructuring `let [ a, b ] = sourceArray`
- Object destructuring `let { a, b } = sourceObject`

### Object Literals

- Property shorthand ` let obj = { a, b }`
- Computed property keys ` let obj = { [a]: "a" }`
- Method definition `let obj = { myMethod(a) { return a } }; obj.myMethod("a");`
- `for...of` loops

### Arrays

- Spread operator `[a, b, ...anotherArray]`
- `.copyWithin()`
- `.entries()`
- `.fill()`
- `.find()`
- `.findIndex()`
- `.keys()`
- `.values()`

### Functions

- Arrow declaration `() => {}`
- Default params `(a, b = true) => {}`
- Rest params `(a, b, ...rest) => {}`
- Destructuring params `({ a, b }) => {}`
- Generators

### Classes

- `class`
- `get`
- `set`
- `static`
- `extends`
- `instanceof`

### Modules

- `import`
- `export`
- `default`

### Regular Expressions

- `/y` (sticky)
- `/u` (unicode)
- `.flags`
- `.source`

### Strings

- Template literals
- `.includes()`
- `.startsWith()`
- `.endsWith()`
- `.repeat()`

### New Global Objects / Methods

- `Map`
- `Set`
- `WeakMap`
- `Promise`
- `Symbol`
- `RegExp`
- `Object`
  - `.assign()`
  - `.entries()`
- `Array`
  - `.from()`
  - `.of()`
- `Number`
  - `.EPSILON `
  - `.MIN_SAFE_INTEGER`
  - `.MAX_SAFE_INTEGER`
  - `.isInteger()`
  - `.isSafeInteger()`
  - `.isFinite()`
  - `.parseFloat()`
  - `.parseInt()`
  - `.isNaN()`
- `Math`
  - `.cbrt()`
  - `.log10()`
  - `.log2()`
  - `.sign()`
  - `.trunc()`
  - `.hypot()`

That's _everything_ released in ES6. It's _a lot_. But if you feel like something's missing from the list, keep going. There's 6 more years of features to go!

Fun fact: ES6 is now fully supported by browsers, so it no longer needs to be transpiled unless you're unfortunate enough to be supporting Internet Explorer (my condolences)

## ES7 / ECMAScript 2016

- Exponentiation `3 ** 4`
- `Array.includes()`

## ES8 / ECMAScript 2017

- Asyncronous functions `async`/`await`
- Object destructuring rest assignment `let { a, b, ...c } = sourceObject`
- Object spread properties `{ a: 'a', b: 'b', ...anotherObject }`
- `Object`
  - `.entries()`
  - `.getOwnPropertyDescriptors()`
  - `.values()`
- `String` prototypes
  - `.padStart()`
  - `.padEnd()`
- Trailing commas in function parameters
- Shared memory and atomics

## ES9 / ECMAScript 2018

- Async iteration `for-await-of`
- Rest and Spread for Object Literals
- `Promise.prototype.finally()`
- Tagged Template Literals
- Regular Expressions
  - named capture groups
  - better escapes
  - lookbehind assertions

## ES10 / ECMAScript 2019

- Optional catch binding
- `Symbol.prototype.description`
- `Object.fromEntries()`
- String methods `.trimStart()` and `.trimEnd()`
- Array methods `.flatMap()` and `.flat()`

## ES11 / ECMAScript 2020

- Bigint data type
- Optional chaining on objects `myObject?.details?.name`
- Nullish coalescing operator `a ?? b`
- `String.prototype.matchAll()`
- Dynamic imports via `import()`
- `Promise.allSettled()`
- `globalThis`
- `import.meta`
- Namespace re-exporting: `export \* as ns from "mod"`

## ES12 / ECMAScript 2021

- `String.prototype.replaceAll()`
- `Promise.any()`
- `WeakRefs` 
- Logical assignment operators
- Underscores as separators in `number` and `bigint`

## What's next for JS?

JavaScript's yearly release pace doesn't look to be slowing down anytime soon. ES13 is already in the works, slated for release in 2022 with a still-growing list of new additions like `.at()` for arrays, `Object.hasOwn()`. If you want to stay ahead of the curve, you can follow the progress of proposals for language additions [here on GitHub](https://github.com/tc39/proposals). There are some that will come out next year, but many more to keep an eye on for later versions (personally, I'm hoping for the pipe operator soon).

But until then, sound off in the comments with the JS features you were surprised are older or newer than you though or that you'd never even heard of before! Unless you work with ECMA International, I'm willing to bet there's a few 😄.