ECMAScript 2022
JavaScript 版本號
舊的 ECMAScript 版本使用數字命名：ES5 和 ES6。
從 2016 年開始，版本以年份命名：ES2016、2018、2020、2022。
ES2022 的新功能
警告
這些功能相對較新。
舊版瀏覽器可能需要替代程式碼（Polyfill）。
JavaScript Array at() 方法
ES2022 引入了陣列方法 at()
示例
獲取 fruits 的第三個元素
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.at(2);
自己動手試一試 »
獲取 fruits 的第三個元素
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits[2];
自己動手試一試 »
at() 方法返回陣列中指定索引的元素。
at() 方法返回與 [] 相同的結果。
at() 方法自 2022 年 3 月起在所有現代瀏覽器中受支援
| Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
| 2021 年 4 月 | 2021 年 7 月 | 2021 年 7 月 | 2022 年 3 月 | 2021 年 8 月 |
注意
許多語言允許使用 負括號索引，例如 [-1]，來訪問物件/陣列/字串末尾的元素。
這在 JavaScript 中是不可能的，因為 [] 用於訪問陣列和物件。obj[-1] 指的是鍵 -1 的值，而不是物件的最後一個屬性。
at() 方法在 ES2022 中引入，旨在解決此問題。
JavaScript String at() 方法
ES2022 引入了字串方法 at()
示例
獲取 name 的第三個字母
const name = "W3Schools";
let letter = name.at(2);
自己動手試一試 »
獲取 name 的第三個字母
const name = "W3Schools";
let letter = name[2];
自己動手試一試 »
方法 at() 從字串返回一個帶索引的元素。
at() 方法返回與 [] 相同的結果。
at() 方法自 2022 年 3 月起在所有現代瀏覽器中受支援
| Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
| 2021 年 4 月 | 2021 年 7 月 | 2021 年 7 月 | 2022 年 3 月 | 2021 年 8 月 |
RegExp d 修飾符
ES2022 添加了 /d 修飾符來表示匹配的開始和結束。
RegExp 修飾符用於指定不區分大小寫以及其他全域性搜尋
| 修飾符 | 描述 | 試一試 |
|---|---|---|
| i | 執行不區分大小寫的匹配 | 試一試 » |
| g | 執行全域性匹配（查詢所有） | 試一試 » |
| m | 執行多行匹配 | 試一試 » |
| d | 執行子字串匹配 (ES2022 新增) | 試一試 » |
Object hasOwn
ES2022 提供了一種安全的方式來檢查屬性是否是物件的自有屬性。
Object.hasOwn() 類似於 Object.prototype.hasOwnProperty，但支援所有物件型別。
Error Cause
ES2022 允許您使用 error.cause 指定錯誤的原因。
示例
try { connectData(); } catch (err) { throw new Error("Connecting failed.", { cause: err }); }
自己動手試一試 »
JavaScript await import
JavaScript 模組現在可以在執行之前等待需要 import 的資源
import {myData} from './myData.js';
const data = await myData();
JavaScript 類欄位宣告
class Hello {
counter = 0; // 類欄位
}
const myClass = new Hello();
let x = myClass.counter;
自 2021 年 4 月起，所有現代瀏覽器都支援類欄位宣告
| Chrome 72 | Edge 79 | Firefox 69 | Safari 14.1 | Opera 60 |
| 2019 年 1 月 | 2020 年 1 月 | 2019 年 9 月 | 2021 年 4 月 | 2020 年 1 月 |
JavaScript 私有方法和欄位
class Hello {
#counter = 0; // 私有欄位
#myMethod() {} // 私有方法
}
const myClass = new Hello();
let x = myClass.#counter; // 錯誤
myClass.#myMethod(); // 錯誤
自 2021 年 6 月起，所有現代瀏覽器都支援私有方法和欄位
| Chrome 74 | Edge 79 | Firefox 90 | Safari 14.1 | Opera 62 |
| 2019年4月 | 2020 年 1 月 | 2021 年 6 月 | 2021 年 4 月 | 2019 年 6 月 |
