js

看看 JaveScript ES2019

一起看看在 ES2019 中带来的新特性。

New

  • Array.prototype.{flat,flatMap}
  • Object.fromEntries
  • String.prototype.{trimStart,trimEnd}
  • Optional Catch Binding
  • JSON ⊂ ECMAScript
  • Well-formed JSON.stringify
  • Function.prototype.toString
  • Symbol.prototype.description

Array.prototype.{flat,flatMap}

flat()

flat()方法会递归到指定深度将所有子数组连接，并返回一个新数组。

1
2
var newArray = arr.flat(depth);
// depth: 可选，指定嵌套数组中的结构深度，默认值为1。
1
2
3
4
5
6
7
8
9
10
11
12
13
// demo

var arr1 = [1, 2, [3]];
arr1.flat();
// [1, 2, 3]

var arr2 = [1, 2, [3, [4, 5]]];
arr2.flat();
// [1, 2, 3, [4, 5]]

var arr3 = [1, 2, [3, [4, 5]]];
arr3.flat(2);
// [1, 2, 3, 4, 5]

flatMap()

flatMap() 方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。等于 map + 深度值 1 的 flat。

1
2
3
4
5
6
7
8
// demo
var arr1 = [1, 2, 3];

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

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

Object.fromEntries

方法 Object.fromEntries() 把键值对列表转换为一个对象。是 Object.entries 的反转。

1
2
3
4
5
6
7
8
9
// demo

const map = new Map([["name", "demo"], ["age", 18]]);
const obj = Object.fromEntries(map);
console.log(obj); // { name: "demo", age: 42 }

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

String.prototype.{trimStart,trimEnd}

trimStart() 方法从字符串的开头删除空格。trimLeft()别名；
trimRight() 方法从一个字符串的右端移除空白字符。trimRight()别名。
不会直接修改原字符串本身。

1
2
3
4
5
6
7
8
9
10
11
12
// demo

var greeting = "   Hello world!   ";

console.log(greeting);
// "   Hello world!   ";

console.log(greeting.trimStart());
// "Hello world!   ";

console.log(greeting.trimEnd());
// "Hello world!";

Optional Catch Binding

try catch 异常捕获变成可选。

1
2
3
4
5
6
7
8
9
10
11
12
13
// Before
try {
   ...
} catch(error) {
   ...
}

// After
try {
   ...
} catch {
   ...
}

JSON ⊂ ECMAScript

现在，字符串文字中允许使用行分隔符（U + 2028）和段落分隔符（U + 2029）符号。以前会导致 SyntaxError 异常。

1
2
eval('"\u2028"');
eval('"\u2029"');

Well-formed JSON.stringify

更加友好的 JSON.stringify，修复了一些超出范围的 unicode 展示。

Function.prototype.toString

.toString()现在返回源代码文本的精确切片，包括空格和注释。

1
2
3
4
5
6
7
8
9
10
11
function /* a comment */ foo() {}

// Previously:
foo.toString();
// 'function foo() {}'
//             ^ no comment
//               ^ no space

// Now:
foo.toString();
// 'function /* comment */ foo () {}'

Symbol.prototype.description

description 是一个只读属性，它会返回 Symbol 对象的可选描述的字符串。

1
2
3
4
5
6
7
8
9
10
11
12
Symbol("desc").toString(); // "Symbol(desc)"
Symbol("desc").description; // "desc"
Symbol("").description; // ""
Symbol().description; // undefined

// well-known symbols
Symbol.iterator.toString(); // "Symbol(Symbol.iterator)"
Symbol.iterator.description; // "Symbol.iterator"

// global symbols
Symbol.for("foo").toString(); // "Symbol(foo)"
Symbol.for("foo").description; // "foo"

More

tc39/proposals: https://github.com/tc39/proposals

参考：
What’s new in JavaScript ES2019 > ECMAScript - A Taste from ES2019 (ES10) > MDN web docs