ECMAScript 2024 (ES15) 為 JavaScript 引進了幾個期待已久的功能。本文透過實際範例和採用時間表指南介紹了新功能。
陣列分組:Object.groupBy 和 Map.groupBy
最受歡迎的 JavaScript 功能之一終於到來了。 Object.groupBy 和 Map.groupBy 根據回呼將陣列元素分割為群組:
const inventory = [
{ name: "asparagus", type: "vegetables", quantity: 5 },
{ name: "bananas", type: "fruit", quantity: 0 },
{ name: "goat", type: "meat", quantity: 23 },
];
const byType = Object.groupBy(inventory, ({ type }) => type);
// { vegetables: [{ name: "asparagus", ... }],
// fruit: [{ name: "bananas", ... }],
// meat: [{ name: "goat", ... }] }
Map.groupBy 保留非字串鍵,使其非常適合按物件或符號進行分組。這消除了對外部函式庫或手動 reduce 模式的需要。
Promise.withResolvers
Promise.withResolvers() 傳回一個 Promise 及其解析和拒絕函數作為屬性,因此無需在建構子外部宣告變數:
const { promise, resolve, reject } = Promise.withResolvers();
// Outside the constructor scope
setTimeout(() => resolve("done"), 1000);
await promise; // "done"
此模式簡化了將基於回呼的 API 轉換為 Promise、管理事件處理程序中的 Promise 生命週期以及實作自訂非同步原語。
ArrayBuffer.prototype.transfer
transfer 和 transferToFixedLength 方法支援緩衝區之間的零拷貝所有權轉移:
const buffer = new ArrayBuffer(1024);
const view = new Uint8Array(buffer);
view[0] = 42;
const transferred = buffer.transfer();
// buffer.byteLength === 0 (detached)
// transferred.byteLength === 1024
這項效能關鍵型功能透過消除記憶體副本和減少 GC 壓力,有利於 WebAssembly 執行時期、Web Worker 通訊和緩衝池管理。
字串:isWellFormed 和 toWellFormed
這些方法解決了 Unicode 格式良好的問題。包含單獨代理程式的格式錯誤的字串可能會導致安全漏洞和渲染問題:
const str = "ab\uD800c";
str.isWellFormed(); // false
str.toWellFormed(); // "ab\ufffdc"
const clean = "hello";
clean.isWellFormed(); // true
對於用戶生成的內容、國際化管道以及任何處理不受信任的文本輸入的系統至關重要。
原子.waitAsync
Atomics.waitAsync 基於同步(和阻塞)Atomics.wait 構建,為共享記憶體同步提供非阻塞 API:
const sab = new SharedArrayBuffer(4);
const int32 = new Int32Array(sab);
Atomics.store(int32, 0, 0);
const { async, value } = Atomics.waitAsync(int32, 0, 0);
// { async: true, value: Promise<"ok" | "not-equal" | "timed-out"> }
這可以實現無鎖資料結構、高效的跨執行緒同步以及即時資料處理,而不會阻塞主執行緒。
採用時間表
| 時間表 | 可用性 |
|---|---|
| 0-6個月 | Chrome、Firefox Nightly、Node.js (–harmony) |
| 6-12 個月 | Node.js LTS 在主要瀏覽器中穩定 |
| 12-18 個月 | Polyfill 可用,早期生產採用 |
| 18-24 個月 | 廣泛使用、TypeScript 支援、ESLint 規則 |
其他值得注意的補充
ES2024 還包括用於改進字元類別操作的 RegExp.prototype.unicodeSets 標誌(v 標誌)、可調整大小的 ArrayBuffer 支持,以及透過 Error 上的 cause 屬性標準化原因鏈。
結論
ES2024 提供了實用的改進,可以滿足開發人員的日常需求。陣列分組簡化了資料轉換,Promise.withResolvers 清理了非同步模式,ArrayBuffer 傳輸解鎖了新的效能可能性。今天就開始透過 polyfill 進行試驗,並為原生支援做好準備,因為瀏覽器全年都會採用這些功能。

