JavaScript: ES2019新特性

译自 Marin Radman : JavaScript: What’s new in ES2019

JavaScript作为最流行的编程语言之一以及Web开发的主要内容,正在不断发展,每次迭代都会得到一些新的内部特性。让我们看看ES2019一些新提议的功能,这些功能很快会进入我们日常的编码:

Array.flat()

递归地将嵌套数组拍平到指定的深度。

  • 默认值为 1 ,如果要拍平到最深层次可以传入 Infinity

  • 此方法不会修改原始数组,而会创建一个新数组。

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

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

const arr3 = [1, 2, [3, 4, [5, 6, [7, 8]]]];
arr3.flat(Infinity);  // [1, 2, 3, 4, 5, 6, 7, 8]

数组中的空位置将会被移除

const arr4 = [1, 2, , 4, 5];
arr4.flat();  // [1, 2, 4, 5]

Array.flatMap()

新的数组方法:使用基本的 map函数 遍历,再将遍历结果使用 Array.flat(1) 拍平

const arr1 = [1, 2, 3];

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

另一个更有用的例子

const sentence = ["This is a", "regular", "sentence"];

sentence.map(x => x.split(" "));
// [["This","is","a"],["regular"],["sentence"]]

sentence.flatMap(x => x.split(" "));
// ["This","is","a","regular", "sentence"]

String.trimStart() and String.trimEnd()

即有的 String.Trim() 会移除字符串两边的空格,现在提供新的方法来移除字符串任意一边的空格

const test = " hello ";

test.trim();  // "hello";
test.trimStart();  // "hello ";
test.trimEnd();  // " hello";

Object.fromEntries()

接受一个数组作为参数,将一组键值对数组转换为对象。它是我们已经熟悉的函数 Object.Entries 的反演,该函数在将对象转换为一组键值对,转化后返回一个数组。现在你可以用 Object.fromEntries 将转化后的数组转化回对象。

一个简单的例子:将一个对象的属性值平方:

  1. 使用 Object.entries() 将对象转为一组键值对

    const obj = { prop1: 2, prop2: 10, prop3: 15 };
    
    let array = Object.entries(obj);
    // [["prop1", 2], ["prop2", 10], ["prop3", 15]]
  2. 使用 Array.map() 将键值对列表的值平方

    array = array.map(([key, value]) => [key, Math.pow(value, 2)]);
    // [["prop1", 4], ["prop2", 100], ["prop3", 225]]
  3. 我们已经转换了对象值,但是留下了一个数组,这时就是 Object.fromEntries() 登场的时候了: Object.fromEntries() 将键值对数组转化回对象

    const newObj = Object.fromEntries(array);
    // {prop1: 4, prop2: 100, prop3: 225}

可选的 Catch 绑定

新的提案允许你完全省略 catch() 的参数,因为很多情况下你并不需要使用它。

try {
  //...
} catch (err) {
  // 使用参数err处理错误
}

try {
  //...
} catch {
  // 不使用参数err处理错误
}

Symbol.description

访问Symbol对象的 description 属性,代替使用 toString() 方法

const testSymbol = Symbol("Desc");

testSymbol.toString();  // "Symbol(Desc)"
testSymbol.description;  // "Desc"

Function.toString()

在函数上调用 toString() ,将函数按声明时的样子原样返回,包括空格和注释。

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

// 现在
foo.toString();
// "function foo() {}"

// ES2019
foo.toString();
// "function /* foo comment */ foo() {}"

JSON.parse() 改进

将行分隔符 (\u2028) 和段落分隔符 (\u2029) 正确解析,而不是导致SyntaxError。

我来评几句
登录后评论

已发表评论数()

相关站点

+订阅
热门文章