Summary — updated April 2022
Babel
One of the biggest changes from ES5 is that ES6 JavaScript is not able to be compiled directly in browsers. We need to use a transpiler called Babel.js to produce compatible JavaScript that the older browsers can read.
Babel allows you to use ES6 features and syntax in your project and then translates it to ES5 so that you can use it in production.
The Most Important ES2019
- ES9 — Array.prototype.flat:
Infinity - ES9 — Symbol.prototype.description:
.description - ES9 — Changes to Object.fromEntries:
Object.fromEntries - ES9 — Other ES9 features
- ES9 — Other updates include
ES9 — Array.prototype.flat
This feature essentially flattens an array recursively up to a pre-specified depth. The flat() method makes a new array containing all sub-array elements. Infinity is used to flatten nested arrays.
const letters = [‘a’, ‘b’, [‘c’, ‘d’, [‘e’, ‘f’]]];
// default depth of 1
console.log(letters.flat());
// [‘a’, ‘b’, ‘c’, ‘d’, [‘e’, ‘f’]]// depth of 2
console.log(letters.flat(2));
// [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]// which is the same as executing flat with depth of 1 twice
console.log(letters.flat().flat());
// [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]// Flattens recursively until the array contains no nested arrays
console.log(letters.flat(Infinity));
// [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]
ES9 — Symbol.prototype.description
The method .description allows you to return an optional description of a Symbol object.Symbol objects can have an optional description used for debugging purposes, and this new update enables you to read that description but does not contain the enclosing Symbol ( ) string.
const me = Symbol(“Sarah”);
console.log(me.description);
// “Sarah”console.log(me.toString());
// “Symbol(Sarah)”
ES9 — Changes to Object.fromEntries
This method transforms your list of key-value pairs into objects, and we can pass any iterable as an argument of Object.fromEntries.
const keyValueArray = [
[‘key1’, ‘value1’],
[‘key2’, ‘value2’]
]const obj = Object.fromEntries(keyValueArray);
console.log(obj);
// {key1: “value1”, key2: “value2”}
ES9 — Other ES9 Features
- Lifting template literals restriction
- RegExp features
Promise.prototype.finally ( )
ES9 — Other updates include
String.prototype.trimStart( )/trimEnd( )- Changes to
Array.sort Function.prototype.toString( )- Optional Catch Binding
Last updated: April 2022
