preface

JavaScript continues to improve and add more features. TC39 has completed and approved these 8 functions of ES2019. It has 4 stages, which are:

  • Stage 0: Strawman
  • Stage 1: Proposals
  • Stage 2: Drafts
  • Stage 3: Candidates
  • Stage 4: Finished/Approved

You can view Stage 0, Stage 1-3, and Final Stages using the following links

Optional Catch binding

The ability to selectively remove it where the catch binding is not used

try {
  // trying to use a new ES2019 feature
  // which may not be implemented in other browsers
} catch (unused) {
  // revert back to old way
}
Copy the code

Unused bindings can now be removed

try{... }catch{... }Copy the code

JSON superset

The motivation for this proposal is that JSON strings can contain unescaped U + 2028 LINE SEPARATOR and U + 2029 PARAGRAPH SEPARATOR characters, whereas ECMAScript strings cannot. Before ES2019, it raises SyntaxError: Invalid or unexpected Token

const LS = eval('"\u2028"');
const PS = eval("'\u2029'");
Copy the code

Symbols that

Symbols are introduced in ES2015 with very unique features. In ES2019, it can now provide a given description. Its aim is to avoid indirectly provided a description of the Symbol. The prototype. ToString

const mySymbol = Symbol("myDescription");

console.log(mySymbol); // Symbol(myDescription)

console.log(mySymbol.toString()); // Symbol(myDescription)

console.log(mySymbol.description); // myDescription
Copy the code

Function. The prototype. ToString – revision

We have previously used the toString method in function prototypes, but in ES2019 it has been modified to include comments within Functions, please note that it does not work on Arrow Functions.

function/ *comment* /foo/ *another comment* /) {}

// Before
console.log(foo.toString()); // function foo(){}

// Now ES2019
console.log(foo.toString()); // function /* comment */ foo /* another comment */ (){}

// Arrow Syntax
const bar /* comment */ = /* another comment */() = > {};console.log(bar.toString()); / / () = > {}
Copy the code

Object.fromEntries

It is the reverse method of Object.entries, and it is one of the ways to clone objects

const obj = {
  prop1: 1.prop2: 2
};

const entries = Object.entries(obj);

console.log(entries); // [ [ 'prop1', 1 ], [ 'prop2', 2 ] ]

const fromEntries = Object.fromEntries(entries);

console.log(fromEntries); // Object { prop1: 1, prop2: 2 }

console.log(obj === fromEntries); // false
Copy the code

Note: Any embedded object/array is copied by reference only.

Well-formed json.stringify

This was also proposed by the same person and is related to the JSON superset feature. Instead of returning unpaired proxy code points as single UTF-16 code units, ES2019 represents them as JSON escape sequences

// Before
console.log(JSON.stringify("\uD800")); / / "�"

// Now ES2019
console.log(JSON.stringify("\uD800")); // "\ud800"
Copy the code

String. The prototype trimStart and trimEnd

We have used the trim method in the String prototype, which removes the space between the beginning and end of the String. But let’s start with THE trimStart and trimEnd of ES2019

// Trim
const name = " Codedam ";
console.log(name.trim()); // "Codedam"

// Trim Start
const description = " Unlocks Secret Codes ";
console.log(description.trimStart()); // "Unlocks Secret Codes "

// Trim End
const category = " JavaScript ";
console.log(category.trimEnd()); // " JavaScript"
Copy the code

Array. The prototype flat and flatMap

The flat method creates a new array, and all the subarray elements are recursively connected to the specified depth. By default, the depth is 1, flattening the first nested array on the array.

const arr = [1.2[3.4[5.6]]];
arr.flat(); // [1, 2, 3, 4, [5, 6]]
arr.flat(2); // [1, 2, 3, 4, 5, 6]

// You can use Infinity to flatten all the nested arrays no matter how deep the array is

const arrExtreme = [1[2[3[4[5.6.7[8.9]]]]]];
arrExtreme.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8, 9]
Copy the code

FlatMap is similar to flat and related to a map, where it maps an array and then flattens it out

const arr = ["Codedam"."is Awsome"."!"];

const mapResult = arr.map(item= > item.split(""));
console.log(mapResult); // [ [ 'Codedam' ], [ 'is', 'Awsome' ], [ '!' ] ]

const flatMapResult = arr.flatMap(chunk= > chunk.split(""));
console.log(flatMapResult); // ['Codedam', 'is', 'Awsome', '!'];
Copy the code

other

Highlight some useful upcoming features in Stage 3 right now.

  • globalThis
  • BigInt
  • import()
  • Legacy RegEx
  • Private instance methods and accessors
  • String.prototype.matchAll

The last

8 NEW FEATURES in JavaScript ES2019