ES 2022 正式發布!有哪些新特性?

2022 年 6 月 22 日,第 123 屆 Ecma 大會批準了 ECMAScript 2022 語言規范[1],這意味著它現在正式成為標準。

1 ECMAScript 2022編輯

本次發布的編輯有:

  • Shu-yu Guo[2]

  • Michael Ficarra[3]

  • Kevin Gibbons[4]

2 ECMAScript 2022有什么新內容?

2.1 新的class成員

class?MyClass?{instancePublicField?=?1;static?staticPublicField?=?2;#instancePrivateField?=?3;static?#staticPrivateField?=?4;#nonStaticPrivateMethod()?{}get?#nonStaticPrivateAccessor()?{}set?#nonStaticPrivateAccessor(value)?{}static?#staticPrivateMethod()?{}static?get?#staticPrivateAccessor()?{}static?set?#staticPrivateAccessor(value)?{}static?{//?靜態初始化代碼塊}
}
  • 可以通過以下方式創建公共屬性 (public slots) :

    • 實例公有屬性[5]

    • 靜態公有屬性[6]

  • 私有屬性[7]是新的,可以通過以下方式創建:

    • 私有屬性 (實例私有屬性[8]?and?靜態私有屬性[9])

    • 私有方法和訪問器 (非靜態[10]?和?靜態[11])

  • 靜態初始化代碼塊[12]

2.2 使用?in?操作符檢查私有屬性

這個操作也被成為 “人性化檢查私有屬性的方式”. 后面的表達式就是示例 –他檢查?obj?是否有一個私有屬性?#privateSlot:

#privateSlot?in?obj

這是個完整例子

class?ClassWithPrivateSlot?{#privateSlot?=?true;static?hasPrivateSlot(obj)?{return?#privateSlot?in?obj;}
}const?obj1?=?new?ClassWithPrivateSlot();
assert.equal(ClassWithPrivateSlot.hasPrivateSlot(obj1),?true
);const?obj2?=?{};
assert.equal(ClassWithPrivateSlot.hasPrivateSlot(obj2),?false
);

請注意,我們只能在聲明它的范圍(scope)內引用私有屬性。

更多關于私有屬性檢查的資料[13]

2.3 模塊中的頂層await

我們現在可以在模塊的頂層使用 await 并且不再需要輸入異步函數或方法

// my-module.mjs
const response = await fetch('https://example.com');
const text = await response.text();
console.log(text);

更多頂層await資料[14]

2.4?error.cause

Error及其子類現在可以讓我們指定哪個錯誤導致了當前錯誤:

try {// Do something
} catch (otherError) {throw new Error('Something went wrong', {cause: otherError});
}

導致當前錯誤的?err?會顯示在調用堆棧中。而且可以通過?err.cause進行訪問

更多關于error.cause[15]

2.5 可索引值方法 .at()

方法?.at()?讓我們可以讀取給定索引處的元素 (就像?[]) 而且支持負數 (與?[]不同):

> ['a', 'b', 'c'].at(0)
'a'
> ['a', 'b', 'c'].at(-1)
'c'

以下“可索引”類型具有?.at()方法:

  • string

  • Array

  • 所有的Typed Array :?Uint8Array?等.

2.6 RegExp match 指數

如果我們給正則添加標志?/d?, 使用它生成匹配對象,就會記錄每個組捕獲的開始和結束索引(A 行和 B 行):

const?matchObj?=?/(a+)(b+)/d.exec('aaaabb');assert.equal(matchObj[1],?'aaaa'
);
assert.deepEqual(matchObj.indices[1],?[0,?4]?//?(A)
);assert.equal(matchObj[2],?'bb'
);
assert.deepEqual(matchObj.indices[2],?[4,?6]?//?(B)
);

更多關于RegExp match indices[16]

2.7?Object.hasOwn(obj, propKey)

Object.hasOwn(obj, propKey)?提供了一個安全的方式檢查對象?obj?是否有鍵為?propKey的自有(非繼承的) 屬性:

const?proto?=?{protoProp:?'protoProp',
};
const?obj?=?{__proto__:?proto,objProp:?'objProp',
}assert.equal('protoProp'?in?obj,?true);?//?(A)assert.equal(Object.hasOwn(obj,?'protoProp'),?false);?//?(B)
assert.equal(Object.hasOwn(proto,?'protoProp'),?true);?//?(C)

請注意,in?檢測繼承的屬性(A 行),而?Object.hasOwn()?僅檢測自己的屬性(B 和 C 行)。

3 FAQ

3.1 ?JavaScript 和 ECMAScript有什么區別?

  • 長話短說版——通俗地說:

    • JavaScript 是由各種平臺(瀏覽器、Node.js、Deno 等)實現的編程語言。

    • ECMAScript是他的標準, 如?the ECMAScript language specification[17]所描述。

  • 長話長說版, 參閱?section “Standardizing JavaScript” in “JavaScript for impatient programmers”[18].

3.2 誰設計ECMAScript?TC39 – Ecma Technical Committee 39

ECMAScript 由標準組織?Ecma International?的技術委員會 39 (TC39)?設計。

其成員嚴格來說是公司:Adobe、Apple、Facebook、Google、Microsoft、Mozilla、Opera、Twitter 等。?也就是說,通常是競爭對手的公司正在合作開發 JavaScript。

每兩個月,TC39 都會召開由成員指定的代表和受邀專家參加的會議。?這些會議的記錄在?GitHub 倉庫[19]中是公開的。

在會議之外,TC39 還與 JavaScript 社區的各種成員和團體合作。

3.3 新特性是如何被記入ECMAScript 中的??它們經歷了 TC39 的那些流程?

新的ECMAScript 特性必須選TC39提交提案,會經歷以下幾個階段:

  • 從階段 0(使 TC39 能夠對提案發表評論)

  • 到第 4 階段(提議的功能已準備好添加到 ECMAScript 中)

一旦一個特性達到第 4 階段,它就會被計劃添加到 ECMAScript 中。ECMAScript 版本的功能集通常在每年的 3 月凍結。?在截止日期之后達到第 4 階段的功能將添加到明年的 ECMAScript 版本中

有關更多信息,請參閱section “The TC39 process” in “JavaScript for impatient programmers”[20].

3.4 ECMAScript 的版本有多重要?

自從 TC39 流程建立以來,ECMAScript 版本的重要性已經大大降低。?現在真正重要的是提議的功能處于哪個階段:一旦達到第 4 階段,就可以安全地使用它。?但即便如此,你仍然需要檢查你的目標引擎是否支持它。

3.5 我最喜歡/關注的xx提案什么進展了?

如果你想知道各種提議的功能處于什么階段,請參閱 TC39 提議庫[21]。

3.6 在哪里可以查看給定 ECMAScript 版本中添加了哪些功能?

有幾個地方我們可以查看每個 ECMAScript 版本中的新內容:

  • 在 “JavaScript for impatient programmers”, 有一個章節?列出了每個 ECMAScript 版本中新增內容[22]。同時還附上了解釋的連接。

  • TC39 庫有一個表格,其中包含已完成的提案[23],其中說明了它們已經(或將要)引入的 ECMAScript 版本。

  • ECMAScript 語言規范的“介紹”[24]部分列出了每個 ECMAScript 版本的新特性。

  • ECMA-262 有一個release頁面[25].

3.7 免費的JavaScript 在線書籍

  • “JavaScript for impatient programmers (ES2022 edition)”[26]?涵蓋直到ECMAScript 2022 的 JavaScript

  • “Deep JavaScript: Theory and techniques”[27]?更深入地涵蓋語言基礎。

參考資料

[1]第 123 屆 Ecma 大會批準了 ECMAScript 2022 語言規范: https://www.ecma-international.org/news/ecma-international-approves-new-standards-6/

[2]Shu-yu Guo: https://twitter.com/_shu

[3]Michael Ficarra: https://twitter.com/smooshMap

[4]Kevin Gibbons: https://twitter.com/bakkoting

[5]實例公有屬性: https://exploringjs.com/impatient-js/ch_classes.html#instance-public-fields

[6]靜態公有屬性: https://exploringjs.com/impatient-js/ch_classes.html#static-public-fields

[7]私有屬性: https://exploringjs.com/impatient-js/ch_classes.html#private-slots

[8]實例私有屬性: https://exploringjs.com/impatient-js/ch_classes.html#instance-private-fields

[9]靜態私有屬性: https://exploringjs.com/impatient-js/ch_classes.html#static-private-methods-accessors-fields

[10]非靜態: https://exploringjs.com/impatient-js/ch_classes.html#private-methods-accessors

[11]靜態: https://exploringjs.com/impatient-js/ch_classes.html#static-private-methods-accessors-fields

[12]靜態初始化代碼塊: https://exploringjs.com/impatient-js/ch_classes.html#class-static-initialization-blocks

[13]更多關于私有屬性檢查的資料: https://exploringjs.com/impatient-js/ch_classes.html#private-slot-checks

[14]更多頂層await資料: https://exploringjs.com/impatient-js/ch_modules.html#top-level-await

[15]更多關于error.cause: https://exploringjs.com/impatient-js/ch_exception-handling.html#error.cause

[16]更多關于RegExp match indices: https://exploringjs.com/impatient-js/ch_regexps.html#regexp-match-indices

[17]the ECMAScript language specification: https://tc39.es/ecma262/

[18]section “Standardizing JavaScript” in “JavaScript for impatient programmers”: https://exploringjs.com/impatient-js/ch_history.html#standardizing-javascript

[19]GitHub 倉庫: https://github.com/tc39/tc39-notes/

[20]section “The TC39 process” in “JavaScript for impatient programmers”: https://exploringjs.com/impatient-js/ch_history.html#tc39-process

[21]請參閱 TC39 提議庫: https://github.com/tc39/proposals/

[22]列出了每個 ECMAScript 版本中新增內容: https://exploringjs.com/impatient-js/ch_new-javascript-features.html

[23]已完成的提案: https://github.com/tc39/proposals/blob/main/finished-proposals.md

[24]“介紹”: https://tc39.es/ecma262/#sec-intro

[25]release頁面: https://github.com/tc39/ecma262/releases

[26]“JavaScript for impatient programmers (ES2022 edition)”: https://exploringjs.com/impatient-js/

[27]“Deep JavaScript: Theory and techniques”: https://exploringjs.com/deep-js/

[28]參考原文: https://2ality.com/2022/06/ecmascript-2022.html

- EOF -

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/283752.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/283752.shtml
英文地址,請注明出處:http://en.pswp.cn/news/283752.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

聯想(Lenovo)小新310經典版進bios方法

1,找到novo按鈕。 2,在關機的狀態下桶一下小孔,不用任何操作,電腦進入bios選擇界面。轉載于:https://www.cnblogs.com/senior-engineer/p/6761457.html

C#中的匿名類型

這節來講一下C#中的匿名類型。匿名類在C#中,我們可以不去顯示的聲明一個類,而是通過匿名類去臨時聲明一個類結構去幫助我們去完成一些功能。聲明一個匿名類,我們可以像下面這樣做:var Anonymousnew {name"charles",year…

MySQL之MHA高可用集群

目錄 一、MHA概述 1.1.MHA 是什么 1.2.MHA 的組成 1.3.MHA 的特點 二、MHA搭建準備 2.1.實驗思路 三、MHA搭建 3.1配置主從復制 3.2.安裝 MHA 軟件 3.3.故障模擬 3.4.故障修復 四、總結 一、MHA概述 1.1.MHA 是什么 1.MHA(MasterHigh Availability&…

Tensorflow之安裝

1.fellow the instruction of https://www.tensorflow.org/install/install_linux#installing_with_anaconda 2.anaconda安裝,修改~/.bash_profile為 export PATH~/anaconda2/bin:/usr/local/cuda/bin:$PATHexport LD_LIBRARY_PATH/usr/local/cuda/lib64:$LD_LIBRAR…

2、Saltstack的數據系統

一、Grainsgrains是salt用來收集minion端底層系統信息的接口。比如,操作系統type、域名 、IP地址、內存及其他相關系統屬性信息等。存儲在minion端,用于保存minion端數據信息。minion啟動時才加載grains信息,所以他時靜態的,Grain…

配置中心 App Configuration (一):輕松集成到Asp.Net Core

寫在前面在日常開發中,我這邊比較熟悉的配置中心有,攜程Apollo,阿里Nacos(配置中心,服務治理一體)之前文章:Asp.Net Core與攜程阿波羅(Apollo)的第一次親密接觸總體來說,Apollo和Nacos社區都比較活躍&#…

stop-hbase.sh一直處于等待狀態

今天關閉HBase時,輸入stop-hbase.sh一直處于等待狀態 解決方法: 先輸入:hbase-daemon.sh stop master 再輸入:stop-hbase.sh就可以關閉HBase集群了。 轉載于:https://www.cnblogs.com/lijinze-tsinghua/p/8667761.html

shell編程100例

1、編寫hello world腳本 #!/bin/bash# 編寫hello world腳本echo "Hello World!"2、通過位置變量創建 Linux 系統賬戶及密碼 #!/bin/bash# 通過位置變量創建 Linux 系統賬戶及密碼#$1 是執行腳本的第一個參數,$2 是執行腳本的第二個參數 useradd "$1" …

sqlserver 分頁

select top 10 numComImg.* from( select row_number() over(order by id asc) as rownumber,* from (select * FROM [TCCLine].[dbo].[CLine_CommonImage]) as comImg)as numComImg where rownumber>40select top 10 * --10 為頁大小from [TCCLine].[dbo].[CLine_CommonIma…

詳解SpringMVC中Controller的方法中參數的工作原理[附帶源碼分析] good

目錄 前言現象源碼分析 HandlerMethodArgumentResolver與HandlerMethodReturnValueHandler接口介紹HandlerMethodArgumentResolver與HandlerMethodReturnValueHandler接口的具體應用常用HandlerMethodArgumentResolver介紹常用HandlerMethodReturnValueHandler介紹本文開頭現象…

instancing render

當要繪制同一個東西很多次的時候,最簡單的想法可能是循環調用glDrawArrays(),但這樣會造成性能的損失。因為當顯卡在渲染一個物體的時候,可能并不需要太多時間,但系統會花大量的時間,頻繁的調用draw命令,再…

對不起,我不是一個自律的人

大家好,我是 🐟💨。前天,星球 的一位大學生朋友問了我幾個問題:你大學時如何安排每日的時間?為什么能學那么多技術?你會學習到很晚嗎?你是如何保持自律的?我覺得這幾個問…

保證接口數據安全的10種方案

前言 大家好,我是程序汪,互聯網項目需要特別注意數據安全,如果你簡歷上是互聯網類型項目,安全方面肯定要能說出個一二三,下面分享下這方面的干貨,大家可以記住幾條,面試時好說道說道 我們日常…

Html5本地存儲LocalStorage

HTML5 提供了兩種在客戶端存儲數據的新方法: localStorage - 沒有時間限制的數據存儲sessionStorage - 針對一個 session 的數據存儲在瀏覽器中打開審查元素(如谷歌F12),在Resources下面可以查看里面的數據。 localStorage提供了幾…

python 中的os模塊

python os模塊 Python os 模塊提供了一個統一的操作系統接口函數一、對于系統的操作1、os.name 當前使用平臺其中 ‘nt’ 是 windows,’posix’ 是linux 或者 unix2、os.sep輸出操作系統的特定的路徑分隔符。Win下為“\”,Linux下為“/”3、os.pathsep 輸…

java第一季2.2

2019獨角獸企業重金招聘Python工程師標準>>> 標識符: 是給變量類方法命名的符號、標識符開頭可以_、字母、$命名,不可以用數字命名。關鍵字不可命名,大小寫區分。不可以用非法字符 變量:變量類型。變量名。變量值。如&…

讀《華為數字化轉型之道》

數字化轉型應該很多人都聽過,但如果你做過 ToB 軟件,聽得更多的是信息化,那信息化和數字化是什么關系呢?下面用一個小例子來說說我的理解。記得剛上初中的時候,平時測驗、考試的試卷,都是人工在板上進行刻寫…

Thrift基本原理及使用

參考文章RPC 基本原理與 Apach Thrift 初體驗 RPC基本原理 RPC(Remote Procedure Call),遠程過程調用,大部分的RPC框架都遵循如下三個開發步驟: 1. 定義一個接口說明文件:描述了對象(結構體)、對象成員、接口方法等一系列信息&am…

01-H5語義化標簽

轉載于:https://www.cnblogs.com/Zeki/p/5901399.html

JSON 解析的兩種方法

今天幫朋友看了下JSON解析結果 eval解析JSON中的注意點在JS中將JSON的字符串解析成JSON數據格式,一般有兩種方式: 1.一種為使用eval()函數。 2. 使用Function對象來進行返回解析。 使用eval函數來解析,并且使用jquery的each方法來遍歷 用jque…