ES2019 规范是对 JavaScript 的一个较小的补充,但它仍然带来了一些有用的功能。本文将向你展示五个 ES2019 新增的特性,这些特性或许可以让你的编程轻松一点。这些特性包括 trimStart()
、trimEnd()
、flat()
、flatMap()
、Object.fromEntries()
等。
这两个方法都可以帮助你从给定的字符串中删除空白空间。第一个方法,trimStart()
将删除字符串开头的所有空白。第二个,trimEnd()
将删除字符串末尾的所有空白。如果你需要去除两边的空白,一种方法是同时使用这两个方法,另一种方法是使用 trim()
这个字符串方法。
'JavaScript'.trimStart() // Output: //'JavaScript' ' JavaScript'.trimStart() // Output: //'JavaScript' ' JavaScript '.trimStart() // Output: //'JavaScript ' 'JavaScript '.trimStart() // Output: //'JavaScript ' ' JavaScript'.trimEnd() // Output: //' JavaScript' ' JavaScript '.trimEnd() // Output: //' JavaScript' 'JavaScript '.trimEnd() // Output: //'JavaScript'
任何对象都有 toString()
方法, 函数也不例外。该方法的作用是允许你打印你或其他人编写的函数的代码。在 ES2019 之前,toString()
方法会删除注释和空白。因此,该函数的打印的版本可能与原始代码不一样。ES2019 发布后,toString()
方法返回的值将与原始值一致,包括注释、空白和特殊字符。
// ES2019 之前: function myFunc /* is this really a good name? */() { /* Now, what to do? */ } myFunc.toString() // Output: // "function myFunc() {}" // ES2019: function myFunc /* is this really a good name? */() { /* Now, what to do? */ } myFunc.toString() // Output: // "function myFunc /* is this really a good name? */() { // /* Now, what to do? */ // }"
数组是 JavaScript 中的基本部分之一,它们有时也会让人头疼,尤其是当你要处理多维数组的时候。比如将多维数组变成一维数组这样一个看似简单的事件。现在 ES2019 为数组提供的 flat()
和 flatMap()
方法可以让这个问题变得简单。
第一个是 flat()
,中文可以理解为展开或扁平化的意思。它的作用是把多维数组扁平化为一维数组。默认情况下,flat()
只会展开第一层。如果你需要扁平化更多的层数或深度,你可以指定一个层数或深度值,作为参数传递。如果你不确定多少层,你也可以使用 Infinity
,表示有多少层展开多少展。
// 创建一个数组: const myArray = ['JavaScript', ['C', 'C++', ['Assembly', ['Bytecode']]]] // 展开数组第一层 let myFlatArray = myArray.flat(1) console.log(myFlatArray) // Output: // [ 'JavaScript', 'C', 'C++', [ 'Assembly', [ 'Bytecode' ] ] ] // 有多少层展开多少层 let myInfiniteFlatArray = myArray.flat(Infinity) console.log(myInfiniteFlatArray) // Output: // [ 'JavaScript', 'C', 'C++', 'Assembly', 'Bytecode' ]
除了 flat()
方法外,还有 flatMap()
方法。你可以把这个方法看作是 flat()
的高级版本。不同的是,flatMap()
方法结合了 flat()
和 map()
方法。当你扁平化一个数组时,你可以调用一个回调函数。这允许你在扁平化的过程中对原数组内部的单个元素进行处理。当你想扁平化一个数组,但同时又想修改内容时,这就很方便了。
// 创建一个数组: const myArray = ['One word', 'Two words', 'Three words'] // 将数组中的字符串使用空格分隔 // 注意:这会创建一个二维数组 const myMappedWordArray = myArray.map((str) => str.split(' ')) console.log(myMappedWordArray) // Output: // [ [ 'One', 'word' ], [ 'Two', 'words' ], [ 'Three', 'words' ] ] // flatMap() 示例 const myArray = ['One word', 'Two words', 'Three words'] // 将数组中的字符串使用空格分隔 const myFlatWordArray = myArray.flatMap((str) => str.split(' ')) console.log(myFlatWordArray) // Output: // [ 'One', 'word', 'Two', 'words', 'Three', 'words' ]
当你需要将一些对象转换为数组时,你可以用 entries()
方法来实现,但反过来将对象的数组合并为单个对象,在 ES2019 之前还没有一个现成的方法。ES2019 提供了 fromEntries()
方法。这个方法的作用很简单。它接受一个键值对的迭代,如数组或Map
。然后,它将其转换为一个对象。
// 将数组转换为对象: const myArray = [ ['name', 'Joe'], ['age', 33], ['favoriteLanguage', 'JavaScript'], ] const myObj = Object.fromEntries(myArray) console.log(myObj) // Output: // { // name: 'Joe', // age: 33, // favoriteLanguage: 'JavaScript' // } // 将 Map 转换为对象: const myMap = new Map([ ['name', 'Spike'], ['species', 'dog'], ['age', 3], ]) const myObj = Object.fromEntries(myMap) console.log(myObj) // Output: // { // name: 'Spike', // species: 'dog', // age: 3 // }
以前,当你使用 try...catch 时,你必须把异常作为一个参数传递给 catch,即使你没有使用这个参数。ES2019 把这个参数变成可选项。如果你不想使用异常,你可以使用不带参数的 catch 块。
// ES2019 之前: try { // Do something. } catch (e) { // 没有用到异常参数 e // 但该参数不能省略 } // ES2019: try { // Do something. } catch { // 没有用到异常参数,可以省略 }
以上五个特性是我觉得比较有用的。除了这五个特性,ES2019 标准还增加了其它的特性或改进,本文没有全部列举出来,如果感兴趣可以查阅官方文档。