javascriptは方法を遍歴して総括します.

forEachサイクル
JavaScriptの誕生からすでに20年以上が経ちました.私達がずっと使っているのは一つの配列を循環する方法です.

for (var index = 0; index < myArray.length; index++) {
  console.log(myArray[index]);
}

JavaScript 5から、内蔵のforEach方法を使うことができます.

myArray.forEach(function (value) {
  console.log(value);
});

書き方は簡単ですが、短所もあります.サイクルを中断してはいけません.
for…inサイクル
JavaScriptにはもう一つの循環方法があります.for…in.for…inサイクルは、実際には、サイクルエニュメレート・オブジェクトのために設計されています.

var obj = {a:1, b:2, c:3};
    
for (var prop in obj) {
  console.log("obj." + prop + " = " + obj[prop]);
}
 
//   :
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

配列を循環させるためにも使用できます.

for (var index in myArray) {    //      
  console.log(myArray[index]);
}

for...inで行列を循環することは推奨されません.オブジェクトとは異なり、配列のindexは通常のオブジェクト属性とは異なり、重要な数値系列指標です.
つまり、for…inは文字列keyのあるオブジェクトを循環させる方法です.
for...ofサイクル
JavaScript 6には新しい循環方法が導入されています.それはfor...ofサイクルです.伝統的なforサイクルよりも簡潔で、forEachとfor-innサイクルのショートプレートを補いました.
for...ofの文法を見てみます.

for (var value of myArray) {
  console.log(value);
}

for…ofの文法はfor…inに似ていますが、機能は豊富で、多くのものを循環することができます.
for...ofサイクル使用例:
1つの配列を循環します.

let iterable = [10, 20, 30];
 
for (let value of iterable) {
  console.log(value);
}
// 10
// 20
// 30

私たちはconstを使ってletの代わりにすることができ、これはサイクル内の修正不可能な静的変数になる.

let iterable = [10, 20, 30];
 
for (const value of iterable) {
  console.log(value);
}
// 10
// 20
// 30

文字列をループ:

let iterable = "boo";
 
for (let value of iterable) {
  console.log(value);
}
// "b"
// "o"
// "o"

1つのタイプ化された配列を循環します.

let iterable = new Uint8Array([0x00, 0xff]);
 
for (let value of iterable) {
  console.log(value);
}
// 0
// 255

一つのMapをループ:

let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
 
for (let [key, value] of iterable) {
  console.log(value);
}
// 1
// 2
// 3
 
for (let entry of iterable) {
  console.log(entry);
}
// [a, 1]
// [b, 2]
// [c, 3]

Setをループ:

let iterable = new Set([1, 1, 2, 2, 3, 3]);
 
for (let value of iterable) {
  console.log(value);
}
// 1
// 2
// 3

DOMの集合を循環して、NodeListのようなDOMの集合を循環します.以前はどのようにNodeListを循環するかを議論しましたが、今は便利になりました.直接forを使うことができます.

// Note: This will only work in platforms that have
// implemented NodeList.prototype[Symbol.iterator]
let articleParagraphs = document.querySelectorAll("article > p");
 
for (let paragraph of articleParagraphs) {
  paragraph.classList.add("read");
}

エニュメレート・属性を持つオブジェクトfor...ofサイクルは通常のオブジェクトでは直接使用できませんが、オブジェクトが持つ属性によって循環すれば、内蔵されたObject.keys()方法が使えます.

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

一つのジェネレータを循環させることができます.一つのジェネレータを循環させます.

function* fibonacci() { // a generator function
  let [prev, curr] = [0, 1];
  while (true) {
    [prev, curr] = [curr, prev + curr];
    yield curr;
  }
}
 
for (let n of fibonacci()) {
  console.log(n);
  // truncate the sequence at 1000
  if (n >= 1000) {
    break;
  }
}