ES13 中最具變革性的五個 JavaScript 功能
ES13 包含許多有價值的功能,徹底改變了我們編寫 JavaScript 的方式。
從異步升級到數(shù)組糖等等,讓我們來看看它們,看看你錯過了什么。
1. 頂級 await
在 ES13 之前,我們永遠無法在全局范圍內(nèi)使用 await。
之前:
我們總是必須將其放入異步函數(shù)中或創(chuàng)建一個異步 IIFE:
ES13 之后:
2. 類聲明升級
1). 類字段聲明
在 ES13 之前,我們只能在構(gòu)造函數(shù)中聲明類字段:
與許多其他語言不同,我們不能在類的最外層范圍內(nèi)聲明或定義它們。
之前:
現(xiàn)在有了 ES13:
就像在 TypeScript 中一樣:
2). 私有方法和字段
在 ES13 之前,創(chuàng)建私有方法是不可能的。
我們還不得不使用丑陋的下劃線 hack 來表示隱私——但那只是一種暗示。
之前:
現(xiàn)在 ES13 之后:
我們可以通過在類前面加上井號 (#) 來向類添加私有字段和成員:
如果您嘗試從類外部訪問它,則會收到語法錯誤:
我們可以從錯誤消息中看到一些有趣的東西:
編譯器甚至不期望您嘗試從類外部訪問私有字段——它假設(shè)您正在嘗試創(chuàng)建一個。
3). 靜態(tài)類字段和靜態(tài)私有方法
靜態(tài)字段——類本身的屬性,而不是任何特定實例。
自 ES13 以來,我們現(xiàn)在可以輕松地為任何類創(chuàng)建它們:
3. 數(shù)組升級:新的 at() 方法
因此,我們通常使用方括號 ([]) 來訪問數(shù)組的第 N 個元素。
但訪問從末尾開始的第 N 個項目總是很麻煩——我們必須使用 arr.length - N 進行索引:
ES13 之前:
幸運的是,ES13 帶來了新的 at() 方法,解決了所有問題:
4. 靜態(tài)類塊
靜態(tài)字段帶來了靜態(tài)塊。
在創(chuàng)建類時只執(zhí)行一次代碼 — 就像 C# 和 Java 等 OOP 語言中的靜態(tài)構(gòu)造函數(shù)一樣。
因此,您可以在類中創(chuàng)建任意數(shù)量的靜態(tài)塊 — 所有代碼都將按照您定義它們的順序運行:
5. 錯誤報告升級
因此,有時我們會捕獲調(diào)用堆棧下方方法的錯誤,然后將其重新拋回堆棧。
但當(dāng)我們這樣做時,我們會丟失原始錯誤中的關(guān)鍵信息:
這就是為什么 ES13 引入了一個新的原因?qū)傩詠肀4孢@些重要信息并使調(diào)試更容易:
最后的想法
總體而言,ES13 對 JavaScript 來說是一次重大飛躍,它具有多項對現(xiàn)代開發(fā)至關(guān)重要的功能。
讓您能夠編寫更簡潔、更具表現(xiàn)力和更清晰的更干凈的代碼。