跳至主要内容

39 篇文章 含有標籤「ECMAScript」

檢視所有標籤

JavaScript's 新超能力:顯式資源管理

· 閱讀時間約 6 分鐘
Rezvan Mahdavi Hezaveh

「顯式資源管理提案」引入了一種確定性的方法,用於顯式管理資源的生命週期,比如檔案控制代碼、網絡連線等。該提案帶來了以下新增功能:usingawait using 聲明,可在資源超出作用域時自動呼叫 dispose 方法;[Symbol.dispose]()[Symbol.asyncDispose]() 符號,用於清理操作;兩個全新的全域物件 DisposableStackAsyncDisposableStack 作為容器以匯總可清除的資源;以及 SuppressedError,作為一種新的錯誤類型(包含最近拋出的錯誤及被抑制的錯誤),用於解決在處置資源期間出現錯誤可能掩蓋既存錯誤的情況,或者另一資源的處置過程中拋出的錯誤。這些新增功能使開發者能夠通過細粒度的資源處置控制撰寫更可靠、高效且可維護的代碼。

迭代器輔助工具

· 閱讀時間約 6 分鐘
Rezvan Mahdavi Hezaveh

迭代器輔助工具 是在 Iterator 原型上新增的一組方法,用於幫助迭代器的一般使用。由於這些輔助方法在迭代器原型上,因此任何在其原型鏈上具有 Iterator.prototype 的對象(例如陣列迭代器)都可以使用這些方法。在以下子部分中,我們解釋了迭代器輔助工具。所有提供的範例都是在一個包含博客文章列表的博客歸檔頁面上運作,展示如何使用迭代器輔助工具來尋找和操作文章。你可在 V8 博客頁面 上嘗試它們!

導入屬性

· 閱讀時間約 3 分鐘
郭書宇 ([@_shu](https://twitter.com/_shu))

之前

V8 在 v9.1 中發布了 導入斷言 功能。此功能允許模組導入語句使用 assert 關鍵字來包含額外資訊。目前,這些額外資訊可用於在 JavaScript 模組中導入 JSON 和 CSS 模組。

RegExp `v` 標誌與集合符號及字符串屬性

· 閱讀時間約 10 分鐘
Mark Davis ([@mark_e_davis](https://twitter.com/mark_e_davis)), Markus Scherer 和 Mathias Bynens ([@mathias](https://twitter.com/mathias))

JavaScript 自 ECMAScript 3(1999 年)以來便支持正則表達式。十六年後,ES2015 引入了Unicode 模式(u 標誌)粘性模式(y 標誌) RegExp.prototype.flags 的取數器。再過三年,ES2018 引入了dotAll 模式(s 標誌)後行斷言命名捕獲組以及Unicode 字符屬性逃脫。而在 ES2020 中,String.prototype.matchAll 讓使用正則表達式變得更簡單。JavaScript 正則表達式已走過很長一段路,並仍在改進。

在 `Array` 和 TypedArray 中查找元素

· 閱讀時間約 2 分鐘
郭書宇 ([@_shu](https://twitter.com/_shu))

從開頭查找元素

Array 中查找滿足某個條件的元素是一項常見任務,可以使用 Array.prototype 和各種 TypedArray 的 findfindIndex 方法完成。Array.prototype.find 接收一個謂詞,並返回陣列中第一個對該謂詞返回 true 的元素。如果謂詞對任何元素都未返回 true,則該方法返回 undefined

`at` 方法用於相對索引

· 閱讀時間約 2 分鐘
郭书宇 ([`@_shu`](https://twitter.com/_shu))

新的 at 方法在 Array.prototype、各種 TypedArray 原型和 String.prototype 上,可以更輕鬆且簡潔地訪問集合末尾附近的元素。

從集合的末尾訪問第 N 個元素是一個常見操作。然而,通常的方法可能會比較冗長,例如 my_array[my_array.length - N],或者表現可能不夠高效,例如 my_array.slice(-N)[0]。新的 at 方法通過解讀負數索引代表“從末尾”來使此操作更具可讀性。之前的例子可以表達為 my_array.at(-N)

錯誤原因

· 閱讀時間約 2 分鐘
Victor Gomes ([@VictorBFG](https://twitter.com/VictorBFG))

假設你有一個函數正在調用兩個分開的工作負載 doSomeWorkdoMoreWork。這兩個函數可以拋出同類型的錯誤,但你需要以不同方式處理它們。

捕捉錯誤並帶有額外上下文信息再次拋出是解決這個問題的一種常見方法,例如:

function doWork() {
try {
doSomeWork();
} catch (err) {
throw new CustomError('某些工作失敗', err);
}
doMoreWork();
}

try {
doWork();
} catch (err) {
// |err| 是來自 |doSomeWork| 還是 |doMoreWork|?
}

可惜上述解決方案比較繁瑣,因為需要創建自己的 CustomError。而更糟的是,沒有任何開發工具能為意外異常提供有用的診斷信息,因為目前還沒有關於如何正確表示這些錯誤的共識。

`Object.hasOwn`

· 閱讀時間約 1 分鐘
Victor Gomes ([@VictorBFG](https://twitter.com/VictorBFG))

今天,編寫像這樣的代碼很常見:

const hasOwnProperty = Object.prototype.hasOwnProperty;

if (hasOwnProperty.call(object, 'foo')) {
// `object` 擁有屬性 `foo`。
}

或者使用一些庫來提供簡化版的 Object.prototype.hasOwnProperty,例如 haslodash.has

通過 Object.hasOwn 提案,我們可以簡單地編寫:

if (Object.hasOwn(object, 'foo')) {
// `object` 擁有屬性 `foo`。
}

Object.hasOwn 已經可以在 V8 v9.3 中使用,只需啟用 --harmony-object-has-own 標誌,並且我們很快會在 Chrome 中推出。

Object.hasOwn 支援情況

匯入聲明

· 閱讀時間約 3 分鐘
Dan Clark ([@dandclark1](https://twitter.com/dandclark1)), 匯入聲明的強勢進口商

全新的匯入聲明功能允許模組匯入語句在模組規範之外附加額外的信息。該功能的初始用途是啟用以JSON 模組形式匯入 JSON 文件:

私有品牌檢查,也就是 `#foo in obj`

· 閱讀時間約 3 分鐘
Marja Hölttä ([@marjakh](https://twitter.com/marjakh))

The in operator 可用於測試給定的物件(或其原型鏈上的任何物件)是否具有給定屬性:

const o1 = {'foo': 0};
console.log('foo' in o1); // true
const o2 = {};
console.log('foo' in o2); // false
const o3 = Object.create(o1);
console.log('foo' in o3); // true

私有品牌檢查功能擴展了 in 操作符以支持私有類字段:

class A {
  static test(obj) {
    console.log(#foo in obj);
  }
  #foo = 0;
}

A.test(new A()); // true
A.test({}); // false

class B {
 #foo = 0;
}

A.test(new B()); // false; 它不是相同的 #foo

由於私有名稱僅在定義它們的類中可用,測試也必須發生在類內部,例如在像上面的 static test 方法中。

子類實例接收來自父類的私有字段作為自身屬性:

class SubA extends A {};
A.test(new SubA()); // true

但是通過 Object.create 創建的物件(或稍後通過 __proto__ 設置器或 Object.setPrototypeOf 設置了原型的物件)未接收到私有字段作為自身屬性。由於私有字段查找僅作用於自身屬性,in 操作符無法找到這些繼承的字段: