ESMA2017(es8) 新特性

_zhiqiu發表於2024-05-23

本章內容:

  1. Object.values()/Object.entries()
  2. async/await
  3. String padding: padStart()padEnd(),填充字串達到當前長度
  4. 函式引數列表結尾允許逗號
  5. Object.getOwnPropertyDescriptors()
  6. ShareArrayBufferAtomics物件,用於從共享記憶體位置讀取和寫入

1.async/await

ES2018 引入非同步迭代器(asynchronous iterators),這就像常規迭代器,除了next()方法返回一個 Promise。因此await可以和for...of迴圈一起使用,以序列的方式執行非同步操作。例如:

async function process(array) {
  for await (let i of array) {
    doSomething(i);
  }
}

Object.values()/Object.entries()

  • Object.values(): 返回物件的value陣列。
  • Object.entries(): 返回物件的[key, value]陣列。

語法

Object.values(obj);
Object.entries(obj);

示例

const obj = {
  a: 1,
  b: 2,
  c: 3,
  d: 4,
};

console.log(Object.values(obj)); // [ 1, 2, 3, 4 ]
console.log(Object.entries(obj));
// [ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ], [ 'd', 4 ] ]

String padding

在 ES8 中 String 新增了兩個例項函式String.prototype.padStartString.prototype.padEnd,允許將空字串或其他字串新增到原始字串的開頭或結尾。

String.padStart(targetLength[,padString])

  • targetLength:當前字串需要填充到的目標長度。如果這個數值小於當前字串的長度,則返回當前字串本身。
  • padString:(可選)填充字串。如果字串太長,使填充後的字串長度超過了目標長度,則只保留最左側的部分,其他部分會被截斷,此引數的預設值為 " "。
"cat".padStart(5); // '  cat'
"cat".padStart(5, "a"); // 'aacat'
"cat".padStart(1, "a"); // 'cat'   指定長度小於字串長度,將不會追加字串
"cat".padStart(5, "abc"); // 'abcat'
"cat".padStart(8, "abc"); // 'abcabcat' 如果追加一次沒有達到指定長度會追加多次

String.padEnd(targetLength[,padString])

  • targetLength:當前字串需要填充到的目標長度。如果這個數值小於當前字串的長度,則返回當前字串本身。
  • padString:(可選) 填充字串。如果字串太長,使填充後的字串長度超過了目標長度,則只保留最左側的部分,其他部分會被截斷,此引數的預設值為 " ";
"cat".padEnd(5); // 'cat  '
"cat".padEnd(5, "a"); // 'cataa'
"cat".padEnd(1, "a"); // 'cat'
"cat".padEnd(5, "abc"); // 'catab'
"cat".padEnd(8, "abc"); // 'catabcab'

5.函式引數列表結尾允許逗號

在某些程式碼庫/樣式指南中,出現了功能呼叫和定義在多行(下列)中拆分的場景:

function clownPuppiesEverywhere(param1, param2) {
  /* ... */
}

clownPuppiesEverywhere("foo", "bar");

在這些情況下,當其他程式碼貢獻者出現並將其他引數新增到這些引數列表之一時,他們必須進行兩行更新:

function clownPuppiesEverywhere(
  param1,
  param2, // updated to add a comma
  param3 // updated to add new parameter
) {
  /* ... */
}

clownPuppiesEverywhere(
  "foo",
  "bar", // updated to add a comma
  "baz" // updated to add new parameter
);

在對版本控制系統管理的程式碼(git、顛覆、善變等)進行此更改的過程中,第 3 行和第 9 行的指責/註釋程式碼歷史記錄資訊將更新為指向新增逗號的人(而不是最初新增引數的人)。

為了幫助緩解這個問題,一些其他語言(Python,D,哈克,...可能是其他人。。。)已新增語法支援,以便在這些引數列表中使用尾隨逗號。這允許程式碼貢獻者始終在以下每行引數列表中用尾隨逗號結束引數新增,並且不必再擔心程式碼歸因問題:

function clownPuppiesEverywhere(
  param1,
  param2 // Next parameter that's added only has to add a new line, not modify this line
) {
  /* ... */
}

clownPuppiesEverywhere(
  "foo",
  "bar" // Next parameter that's added only has to add a new line, not modify this line
);

請注意,此建議僅針對語法,並且不會更改語義

6.Object.getOwnPropertyDescriptors()

Object.getOwnPropertyDescriptors()函式用來獲取一個物件的所有自身屬性的描述符,如果沒有任何自身屬性,則返回空物件。

函式原型:

Object.getOwnPropertyDescriptors(obj);

返回obj物件的所有自身屬性的描述符,如果沒有任何自身屬性,則返回空物件。

const obj2 = {
  name: "Tom",
  get age() {
    return "18";
  },
};
Object.getOwnPropertyDescriptors(obj2);
// {
//   age: {
//     configurable: true,
//     enumerable: true,
//     get: function age(){}, //the getter function
//     set: undefined
//   },
//   name: {
//     configurable: true,
//     enumerable: true,
//     value:"Tom",
//     writable:true
//   }
// }

7.SharedArrayBuffer 物件

SharedArrayBuffer 物件用來表示一個通用的,固定長度的原始二進位制資料緩衝區,類似於 ArrayBuffer 物件,它們都可以用來在共享記憶體(shared memory)上建立檢視。與 ArrayBuffer 不同的是,SharedArrayBuffer 不能被分離。

/**
 *
 * @param {*} length 所建立的陣列緩衝區的大小,以位元組(byte)為單位。
 * @returns {SharedArrayBuffer} 一個大小指定的新 SharedArrayBuffer 物件。其內容被初始化為 0。
 */
new SharedArrayBuffer(length);

Atomics 物件

共享記憶體能被同時建立和更新於工作者執行緒或主執行緒。依賴於系統(CPU,作業系統,瀏覽器),變化傳遞給所有上下文環境需要一段時間。需要透過 atomic 操作來進行同步。

Atomics 物件提供了一組靜態方法用來對 SharedArrayBuffer 物件進行原子操作。

這些原子操作屬於 Atomics 模組。與一般的全域性物件不同,Atomics 不是建構函式,因此不能使用 new 運算子呼叫,也不能將其當作函式直接呼叫。Atomics 的所有屬性和方法都是靜態的(與 Math 物件一樣)。

  • Atomics.add()

  • 將指定位置上的陣列元素與給定的值相加,並返回相加前該元素的值。

  • Atomics.and()

  • 將指定位置上的陣列元素與給定的值相與,並返回與操作前該元素的值。

  • Atomics.compareExchange()

  • 如果陣列中指定的元素與給定的值相等,則將其更新為新的值,並返回該元素原先的值。

  • Atomics.exchange()

  • 將陣列中指定的元素更新為給定的值,並返回該元素更新前的值。

  • Atomics.isLockFree(size)

  • 可以用來檢測當前系統是否支援硬體級的原子操作。對於指定大小的陣列,如果當前系統支援硬體級的原子操作,則返回 true;否則就意味著對於該陣列,Atomics 物件中的各原子操作都只能用鎖來實現。此函式面向的是技術專家。

  • Atomics.load()

  • 返回陣列中指定元素的值。

  • Atomics.notify()

  • 喚醒等待佇列中正在陣列指定位置的元素上等待的執行緒。返回值為成功喚醒的執行緒數量。

  • Atomics.or()

  • 將指定位置上的陣列元素與給定的值相或,並返回或操作前該元素的值。

  • Atomics.store()

  • 將陣列中指定的元素設定為給定的值,並返回該值

  • Atomics.sub()

  • 將指定位置上的陣列元素與給定的值相減,並返回相減前該元素的值。

  • Atomics.wait()

  • 檢測陣列中某個指定位置上的值是否仍然是給定值,是則保持掛起直到被喚醒或超時。返回值為 "ok"、"not-equal" 或 "time-out"。呼叫時,如果當前執行緒不允許阻塞,則會丟擲異常(大多數瀏覽器都不允許在主執行緒中呼叫 wait())。

  • Atomics.xor()

  • 將指定位置上的陣列元素與給定的值相異或,並返回異或操作前該元素的值。

相關文章