The most complete Es6 - Es11 (Es10 articles)

There are links to other articles at the end of the article

Es10

1. Object method extension

Object.fromEntries()
The Object.fromEntries() method accepts a list of key-value pairs as argument and returns a new object with these key-value pairs. This iteration parameter should be an object that can implement the @@iterator method, returning an iterator object. It produces an array-like object with two elements, the first element is the value that will be used as the attribute key, and the second element is the value associated with that attribute key.
Object.fromEntries() performs the reciprocal operation of Object.entries.

Through Object.fromEntries, Map can be converted to Object:

const map = new Map([ ['foo', 'bar'], ['baz', 42] ]);
const obj = Object.fromEntries(map);
console.log(obj); // { foo: "bar", baz: 42 }

Through Object.fromEntries, Array can be converted to Object:

const arr = [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ];
const obj = Object.fromEntries(arr);
console.log(obj); // { 0: "a", 1: "b", 2: "c" }

2. String method extension

String.prototype.trimStart()
The trimStart() method removes spaces from the beginning of a string. trimLeft() is an alias for this method. Returns a new string representing the calling string with spaces removed from its beginning (left end).

var str = "   foo  ";

console.log(str.length); // 8

str = str.trimStart()    // 等同于 str = str.trimLeft();
console.log(str.length); // 5
console.log(str);        // "foo  "

String.prototype.trimEnd()
The trimEnd() method removes whitespace characters from the end of a string. trimRight() is an alias for this method. Returns a new string representing the last (right) end of the calling string with whitespace removed.

var str = "   foo  ";

alert(str.length); // 8

str = str.trimRight();  // 或写成str = str.trimEnd();
console.log(str.length); // 6
console.log(str);       // '   foo'

3. Array method extension

Array.prototype.flat()
The flat() method will recursively traverse the array according to a specifiable depth, and merge all elements with the elements in the traversed sub-array into a new array and return it.
Syntax: var newArray = arr.flat([depth]) (depth specifies the depth of the structure to extract the nested array, the default value is 1.)

const arr1 = [0, 1, 2, [3, 4]];

console.log(arr1.flat());
// output: [0, 1, 2, 3, 4]

const arr2 = [0, 1, 2, [[[3, 4]]]];

console.log(arr2.flat(2));
// output: [0, 1, 2, [3, 4]]

Array.prototype.flatMap()
The flatMap() method first maps each element using a mapping function and then compresses the result into a new array. It's almost the same as map followed by flat with a depth value of 1, but flatMap is usually slightly more efficient when combined into one method.
The flatMap method is almost identical to the map method and flat with a depth of 1.

var arr1 = [1, 2, 3, 4];

arr1.map(x => [x * 2]);
// [[2], [4], [6], [8]]

arr1.flatMap(x => [x * 2]);
// [2, 4, 6, 8]

// only one level is flattened
arr1.flatMap(x => [[x * 2]]);
// [[2], [4], [6], [8]]

4. Symbol attribute expansion

Symbol.prototype.description
description is a read-only property that returns a string that optionally describes the Symbol object.

console.log(Symbol('desc').description);
// output: "desc"

console.log(Symbol.iterator.description);
// output: "Symbol.iterator"

console.log(Symbol.for('foo').description);
// output: "foo"

console.log(`${
      
      Symbol('foo').description}bar`);
// output: "foobar"

Previous article: The most complete Es6 - Es11 (Es9 articles)
Next article: The most complete Es6 - Es11 (Es11 articles)

Guess you like

Origin blog.csdn.net/weixin_44646763/article/details/124917187