ES13 包含許多有價(jià)值的功能，徹底改變了我們編寫 JavaScript 的方式。

從異步升級(jí)到數(shù)組糖等等，讓我們來看看它們，看看你錯(cuò)過了什么。

1. 頂級(jí) await

在 ES13 之前，我們永遠(yuǎn)無法在全局范圍內(nèi)使用 await。

之前：

我們總是必須將其放入異步函數(shù)中或創(chuàng)建一個(gè)異步 IIFE：

ES13 之后：

2. 類聲明升級(jí)

1）. 類字段聲明

在 ES13 之前，我們只能在構(gòu)造函數(shù)中聲明類字段：

與許多其他語言不同，我們不能在類的最外層范圍內(nèi)聲明或定義它們。

之前：

現(xiàn)在有了 ES13：

就像在 TypeScript 中一樣：

2). 私有方法和字段

在 ES13 之前，創(chuàng)建私有方法是不可能的。

我們還不得不使用丑陋的下劃線 hack 來表示隱私——但那只是一種暗示。

之前：

現(xiàn)在 ES13 之后：

我們可以通過在類前面加上井號(hào) (#) 來向類添加私有字段和成員：

如果您嘗試從類外部訪問它，則會(huì)收到語法錯(cuò)誤：

我們可以從錯(cuò)誤消息中看到一些有趣的東西：

編譯器甚至不期望您嘗試從類外部訪問私有字段——它假設(shè)您正在嘗試創(chuàng)建一個(gè)。

3). 靜態(tài)類字段和靜態(tài)私有方法

靜態(tài)字段——類本身的屬性，而不是任何特定實(shí)例。

自 ES13 以來，我們現(xiàn)在可以輕松地為任何類創(chuàng)建它們：

3. 數(shù)組升級(jí)：新的 at() 方法

因此，我們通常使用方括號(hào) ([]) 來訪問數(shù)組的第 N 個(gè)元素。

但訪問從末尾開始的第 N 個(gè)項(xiàng)目總是很麻煩——我們必須使用 arr.length - N 進(jìn)行索引：

ES13 之前：

幸運(yùn)的是，ES13 帶來了新的 at() 方法，解決了所有問題：

4. 靜態(tài)類塊

靜態(tài)字段帶來了靜態(tài)塊。

在創(chuàng)建類時(shí)只執(zhí)行一次代碼 — 就像 C# 和 Java 等 OOP 語言中的靜態(tài)構(gòu)造函數(shù)一樣。

因此，您可以在類中創(chuàng)建任意數(shù)量的靜態(tài)塊 — 所有代碼都將按照您定義它們的順序運(yùn)行：

5. 錯(cuò)誤報(bào)告升級(jí)

因此，有時(shí)我們會(huì)捕獲調(diào)用堆棧下方方法的錯(cuò)誤，然后將其重新拋回堆棧。

但當(dāng)我們這樣做時(shí)，我們會(huì)丟失原始錯(cuò)誤中的關(guān)鍵信息：

這就是為什么 ES13 引入了一個(gè)新的原因?qū)傩詠肀４孢@些重要信息并使調(diào)試更容易：

最后的想法

總體而言，ES13 對(duì) JavaScript 來說是一次重大飛躍，它具有多項(xiàng)對(duì)現(xiàn)代開發(fā)至關(guān)重要的功能。

讓您能夠編寫更簡(jiǎn)潔、更具表現(xiàn)力和更清晰的更干凈的代碼。

學(xué)習(xí)更多技能

請(qǐng)點(diǎn)擊下方公眾號(hào)