ECMAScript是JavaScript基於的標準,通常縮寫為ES。了解有關ECMAScript的所有內容,以及在ES2019中添加的功能

ESNext是一個總是指代JavaScript的下一個版本的名稱。

當前的ECMAScript版本是ES2018。它於2018年6月發布。

根據歷史,JavaScript版本通常在夏季進行標準化,因此我們可以預計ECMAScript 2019將於2019年夏季發布。

因此,在撰寫本文時,ES2018已經發布了,而ESNext即為ES2019

對ECMAScript標準的提案按照階段進行組織。 1至3階段是新功能的孵化器,達到4階段的功能將作為新標準的一部分完成。

在撰寫本文時,我們在第4階段上有許多功能。我將在本節中介紹它們。主要瀏覽器的最新版本應已實現其中的大多數。

  • Array.prototype.{flat,flatMap}(數組的一階方法)
  • 可選catch綁定
  • Object.fromEntries()(從對象條目創建對象)
  • String.prototype.{trimStart,trimEnd}(字符串的一階方法)
  • Symbol.prototype.description(Symbol的描述)
  • JSON改進
  • 符合格式的JSON.stringify()(對JSON.stringify()的修復)
  • Function.prototype.toString()(函數的一階方法)

其中一些變更主要是為內部使用而進行的,但也了解一下非常好。

在第3階段還有一些其他功能,這些功能在接下來的幾個月可能被提升到第4階段,您可以在此GitHub存儲庫上查看它們:https://github.com/tc39/proposals

Array.prototype.{flat,flatMap}(數組的一階方法)

flat()是一個新的數組實例方法,可以從多維數組創建一個一維數組。

示例:

;['Dog', ['Sheep', 'Wolf']].flat()
//[ 'Dog', 'Sheep', 'Wolf' ]

默認情況下,它僅“展平”到一個級別,但是您可以添加一個參數來設置要將數組展平的級別數。將其設置為Infinity以獲得無限級數:

;['Dog', ['Sheep', ['Wolf']]]
 .flat()
 [
 //[ 'Dog', 'Sheep', [ 'Wolf' ] ]

 ('Dog', ['Sheep', ['Wolf']])
 ].flat(2)
 [
 //[ 'Dog', 'Sheep', 'Wolf' ]

 ('Dog', ['Sheep', ['Wolf']])
 ].flat(Infinity)
//[ 'Dog', 'Sheep', 'Wolf' ]

如果您熟悉數組的JavaScript map()方法,則知道使用它,可以對數組的每個元素執行一個函數。

flatMap()是一個結合了flat()map()的新的數組實例方法。當在map()回調中調用返回數組的函數時,它非常有用,但是您希望結果數組是平的:

;['My dog', 'is awesome']
 .map((words) => words.split(' '))
 [
 //[ [ 'My', 'dog' ], [ 'is', 'awesome' ] ]

 ('My dog', 'is awesome')
 ].flatMap((words) => words.split(' '))
//[ 'My', 'dog', 'is', 'awesome' ]

可選catch綁定

有時我們不需要在try/catch的catch塊中有一個綁定的參數。

我們以前必須這樣做:

try {
 //...
} catch (e) {
 //handle error
}

即使我們從未使用e來分析錯誤。現在我們可以簡單地省略它:

try {
 //...
} catch {
 //handle error
}

Object.fromEntries()(從對象條目創建對象)

對象具有entries()方法,自ES2017以來就被引入。

它返回一個包含對象自有屬性的數組,作為一個由[key, value]對組成的數組:

const person = { name: 'Fred', age: 87 }
Object.entries(person) // [['name', 'Fred'], ['age', 87]]

ES2019引入了一個新的Object.fromEntries()方法,它可以從這種屬性數組創建一個新的對象:

const person = { name: 'Fred', age: 87 }
const entries = Object.entries(person)
const newPerson = Object.fromEntries(entries)

person !== newPerson //true

String.prototype.{trimStart,trimEnd}(字符串的一階方法)

此功能已經在v8/Chrome中存在了將近一年的時間,並將在ES2019中進行標準化。

trimStart()

從原始字符串的開頭返回一個刪除了空白的新字符串

'Testing'.trimStart() //'Testing'
' Testing'.trimStart() //'Testing'
' Testing '.trimStart() //'Testing '
'Testing '.trimStart() //'Testing '

trimEnd()

從原始字符串的末尾返回一個刪除了空白的新字符串

'Testing'.trimEnd() //'Testing'
' Testing'.trimEnd() //' Testing'
' Testing '.trimEnd() //' Testing'
'Testing '.trimEnd() //'Testing'

Symbol.prototype.description(Symbol的描述)

現在,您可以通過訪問其description屬性,而不是使用toString()方法,來檢索Symbol的描述:

const testSymbol = Symbol('Test')
testSymbol.description // 'Test'

JSON改進

在此更改之前,行分隔符(\u2028)和段落分隔符(\u2029)符號在被解析為JSON的字符串中是不允許的。

在使用JSON.parse()時,這些字符導致SyntaxError,但現在它們按照JSON標準進行解析。

符合格式的JSON.stringify()(對JSON.stringify()的修復)

修復了處理UTF-8代理編碼的JSON.stringify()輸出(U+D800到U+DFFF的代理代碼點)。

在此更改之前,調用JSON.stringify()會返回一個形狀錯誤的Unicode字符(一‘’)。

現在,這些代理代碼點可以安全地使用JSON.stringify()表示為字符串,並使用JSON.parse()轉換回其原始表示。

Function.prototype.toString()(函數的一階方法)

函數一直有一個名為toString()的實例方法,該方法返回包含函數代碼的字符串。

ES2019對返回值進行了更改,以避免刪除註釋和其他字符,例如空格,確切表示函數的定義。

如果以前我們有:

function /\* this is bar \*/ bar() {}

行為是這樣的:

bar.toString() //'function bar() {}

現在新的行為是:

bar.toString() // 'function /\* this is bar \*/ bar () {}'