ECMAScript 2019(简称 ES2019)是 JavaScript 语言的最新版本,新增了许多有用的特性,这些特性可以帮助开发者更快、更好的编写 JavaScript 代码。在这篇文章中,我会详细的介绍 ES2019 中最实用的 10 个新特性,希望这些特性可以让你的 JavaScript 开发效率倍增!
1. Array.prototype.flat()
Array.prototype.flat() 是 ECMAScript 2019 中最实用的新特性之一,它可以将多维嵌套的数组变为一维数组。该方法对于深度嵌套的数组非常实用,如下所示:
const arr = [1, 2, [3, 4, [5, 6]]]; const flattenedArr = arr.flat(2); // [1, 2, 3, 4, 5, 6]
在上面的例子中,.flat(2) 方法将嵌套数组中的所有元素展开成了一维数组。
2. Array.prototype.flatMap()
Array.prototype.flatMap() 方法可以对数组中的每个元素执行一个映射操作,并将结果打平成一个新数组,其实可以看成是 .map() 方法后直接使用 .flat() 方法的简写方式。
const arr = [1, 2, 3, 4]; const flatMappedArr = arr.flatMap(x => [x * 2]); // [2, 4, 6, 8]
在上面的例子中,我们使用 .flatMap() 方法将数组 arr 中的每个元素都乘以 2,并将结果打平成了一个新的一维数组。
3. Object.fromEntries()
Object.fromEntries() 方法可以将二维数组转为对象,该方法接收一个包含键值对的数组,返回一个对象。
const entries = [['foo', 'bar'], ['baz', 42]]; const obj = Object.fromEntries(entries); // {foo: "bar", baz: 42}
在上面的例子中,我们使用 .fromEntries() 方法将二维数组 entries 转换为对象 obj。
4. String.prototype.trimStart() 和 String.prototype.trimEnd()
新增的 .trimStart() 和 .trimEnd() 方法可以分别从字符串的开始和末尾删除空格字符。
const str = ' hello world '; console.log(str.trimStart()); // 'hello world ' console.log(str.trimEnd()); // ' hello world'
在上面的例子中,我们使用 .trimStart() 和 .trimEnd() 方法分别删除了字符串 str 的开头和结尾的空格。
5. Symbol.prototype.description
Symbol.prototype.description 属性用于获取 Symbol 的描述,该属性的返回值为一个字符串。
const mySymbol = Symbol('Hello'); console.log(mySymbol.description); // 'Hello'
在上面的例子中,我们使用 Symbol.prototype.description 属性获取了 Symbol 实例 mySymbol 的描述。
6. Promise.prototype.finally()
Promise.prototype.finally() 方法用于指定不管 Promise 对象最终状态如何都会执行的操作,即无论 Promise 对象是 rejected 还是 resolved,都会执行指定的操作。
fetch('https://api.github.com/users/github') .then(response => response.json()) .catch(error => console.error(error)) .finally(() => console.log('请求完成。'))
在上面的例子中,我们使用 .finally() 方法指定了一个请求完成后会被执行的回调函数。
7. Optional Catch Binding
ES2019 中引入了可选的 catch 绑定,该特性使得我们可以不必声明一个 error 变量,从而避免出现无用的变量声明。
try { doSomethingThatCouldThrowAnError(); } catch { console.log('出错了!'); }
在上面的例子中,我们使用了可选的 catch 绑定,无需声明 error 变量。
8. Numeric Separators
ES2019 中新增了数字分隔符特性,该特性可以让我们在数字常量中添加可读性更强的下划线,从而使数字常量更易读。
const billion = 1_000_000_000; const hexadecimal = 0x_EA_DF_87_5A;
在上面的例子中,我们分别使用数字分隔符特性建立了 10 位数的十进制数字和 8 位数的十六进制数字。
9. Object.getOwnPropertyDescriptors()
Object.getOwnPropertyDescriptors() 方法用于获取对象的所有属性的描述符,包括属性值、属性可枚举性、属性可修改性等。
const obj = { name: 'Tom', age: 18, }; const descriptors = Object.getOwnPropertyDescriptors(obj); console.log(descriptors);
在上面的例子中,我们使用 .getOwnPropertyDescriptors() 方法获取了对象 obj 所有属性的描述符。
10. Array.prototype.{flat, flatMap} 的稳定性
最后,一个比较好的消息是 Array.prototype.{flat, flatMap} 这两个方法的稳定性已经得到了确认,所以我们可以放心的在项目中使用它们。
const arr = [1, 2, [3, 4, [5, 6]]]; const flattenedArr = arr.flat(2); // [1, 2, 3, 4, 5, 6]
在上面的例子中,我们使用了 .flat() 方法将嵌套数组中的所有元素展开成了一维数组。
结论
在本文中,我们详细的介绍了 ECMAScript 2019 中最实用的 10 个新特性。这些特性包括 .flat()、.flatMap()、.fromEntries()、.trimStart()、.trimEnd()、.description、.finally()、可选的 catch 绑定、数字分隔符和 .getOwnPropertyDescriptors() 方法。这些新特性可以让我们更好、更快的编写 JavaScript 代码,提高开发效率。因此,我们可以放心的将它们用于我们的项目中,享受它们带来的便利。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/672f1dd5eedcc8a97c8caf10