一次性明了 ECMAScript 2019 的新语法：简明易懂的 ES10 语法学习指南！

ECMAScript是JavaScript的标准化规范，每年都会发布一个新的版本，新增各种优化和新语法，让我们的开发更加方便快捷。2019年发布的ECMAScript 10是最新的版本，其中也新增了一些实用且实际的语法。本次文章将为大家介绍ES10的新语法及其使用方式。

Array Flat

数组扁平化是经常用到的一个操作，它将多维数组转换为单层数组。ES10提供了一个非常方便的方法：flat()。

const arr = [1, [2, 3], [4, [5, 6]]];
const flatArr = arr.flat();
console.log(flatArr); //[1, 2, 3, 4, 5, 6]

flat()可以传入一个参数，表示扁平化层数。

const arr = [1, [2, 3], [4, [5, 6]]];
const flatArr = arr.flat(2);
console.log(flatArr); //[1, 2, 3, 4, 5, 6]

Array FlatMap

ES10中，也新增了flatMap()方法，它结合了map()和flat()，可以有效简化代码。

const arr = [1, 2, 3];
const result = arr.flatMap(num => [num * 2]);
console.log(result); //[2, 4, 6]

Object From Entries

ES10中，新增了一个Object.fromEntries()方法。它可以方便地将一个二维数组转换为对象。

const arr = [["name", "Tom"], ["age", 20]];
const obj = Object.fromEntries(arr);
console.log(obj); //{name: "Tom", age: 20}

String TrimStart 和 TrimEnd

ES10中，新增了两个方法，即trimStart()和trimEnd()，它们可以分别用于去除字符串左侧和右侧空格。

const str = "     Hello World    ";
console.log(str.trim()); // "Hello World"
console.log(str.trimStart()); // "Hello World    "
console.log(str.trimEnd()); // "     Hello World"

Optional Catch Binding

ES10中，catch语句可以不强制绑定被捕获的错误对象。

try {
    // do something
} catch {
    // handle the error
}

这种写法也等价于下面的写法：

try {
    // do something
} catch (e) {
    // handle the error
}

数组和对象解构赋值

ES10中，数组和对象的解构赋值支持默认值。

// 数组解构赋值
let [x, y = 2] = [1];
console.log(x, y); // 1, 2

// 对象解构赋值
let {a, b = 2} = {a: 1};
console.log(a, b); // 1, 2

BigInt类型

ES10中引入了一种新的数据类型BigInt，可以用于表示任意精度的整数。在实际应用中，例如在处理大型或超长整数时，使用BigInt会更加高效。

const max = Number.MAX_SAFE_INTEGER;
console.log(max); //9007199254740991
console.log(max + 1); //9007199254740992
console.log(max + 2); //9007199254740992
console.log(BigInt(max) + 2n); //9007199254740993n

Conclusion

ES10的新语法虽然不如ES6和ES7等版本那么引人注目，但仍不乏精华和实用性，可以让我们开发更加高效和方便。掌握这些新语法有助于我们更好地应对开发的各种需求，提升开发效率。

在实际开发中，我们也要注意使用新语法的场景和兼容性问题，避免造成不必要的麻烦和问题。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67c7b76acc0f7239cdf96cf3