for ... of 迴圈

Version >= 6

const iterable = [0, 1, 2];
for (let i of iterable) {
    console.log(i);
}

預期輸出：

0
1
2

迴圈的優點是：

• 這是迴圈陣列元素的最簡潔，直接的語法
• 它避免了……中的所有陷阱
• 與 forEach() 不同，它適用於 break，continue 和 return

支援其他館藏

字串

for … of 將字串視為 Unicode 字元序列：

const string = "abc";
for (let chr of string) {
  console.log(chr);
}

預期輸出：

a b c

集

for …對 Set 物件的工作 。

注意 ：

• Set 物件將消除重複。
• 有關 Set() 瀏覽器支援，請檢視此參考 。

const names = ['bob', 'alejandro', 'zandra', 'anna', 'bob'];

const uniqueNames = new Set(names);

for (let name of uniqueNames) {
  console.log(name);
}

預期輸出：

bob
alejandro
zandra
anna

地圖

你還可以使用 for 迴圈迭代 Map 。這類似於陣列和集合，除了迭代變數儲存鍵和值。

const map = new Map()
  .set('abc', 1)
  .set('def', 2)

for (const iteration of map) {
  console.log(iteration) //will log ['abc', 1] and then ['def', 2]
}

你可以使用解構分配來分別捕獲鍵和值：

const map = new Map()
  .set('abc', 1)
  .set('def', 2)

for (const [key, value] of map) {
  console.log(key + ' is mapped to ' + value)
}
/*Logs:
  abc is mapped to 1
  def is mapped to 2
*/

物件

for … of 迴圈不能直接在普通物件上工作; 但是，可以通過切換到 for … in 迴圈或使用 Object.keys() 來迭代物件的屬性 ：

const someObject = { name: 'Mike' };

for (let key of Object.keys(someObject)) {
  console.log(key + ": " + someObject[key]);
}

預期輸出：

姓名：邁克