でのループ


オブジェクトをループする方法と、特定の状況で使用するループのタイプがJavaScriptで熟練するために非常に重要です.以下の5種類のループがあります.

インループ
オブジェクトを反復処理するために使用します.
例:const pet = { name: “Rex”, breed: “Pug”, color: “brown” }
for (const key in pet) { console.log(pet[key]) } // => Rex / Pug / brown
注意:これは列挙可能なプロパティ(非シンボル)を持つ任意のオブジェクトで動作します.したがって、配列で動作しますが、配列用にデザインされたループを使用する方がずっと良いです.
注意:プロパティがオブジェクトと同じ順序で訪問されることを保証しません.ループ中のプロパティを変更する場合は、避ける必要があります.より良いオプションはオブジェクトを使用することです.ループで使用できる配列を返します.

ループ用
配列を反復処理するために使用します.
例:
const petArray = 
  [
    { name: “Rex”, breed: “Pug”, color: “brown” },
    { name: “Pebbles”, breed: “Dalmatian”, color: “white with 
      black spots” },
  ]

for (const element of petArray) { console.log(element[‘name’]) } //=> Rex / Pebbles
注意:文字列、配列、配列のようなオブジェクトで動作します.
文字列をループする例const stringArray = “this is a string”
for (const letter of stringArray) { console.log(letter) } //=> t / h / i / s / …
注意:これは最高の各要素を訪問し、要素を変更していないときに使用されます.各要素に対してアクションを実行する場合は、mapやreduceのようなより良い方法があります.イテレーションを制御したり、ループ内の要素のインデックスにアクセスしたい場合は、ループ用の基本がうまく動作します.

ループごとに
コールバック関数を使用して配列をループします.オプションのインデックス、配列、引数の引数.
例:petArray.forEach( (element, index) => console.log(index, element.name)) //=> 0 “Rex” / 1 “Pebbles”注意:ループの場合と同様ですが、コールバック関数が必要です.インデックスへのアクセスが必要な場合や、より複雑なアクションを実行する必要がある場合に便利です.繰り返しますが、配列内の各要素を訪問する必要があるときにこれが最適です.より複雑な状況では、ループのための規則はより良いかもしれません.

ループ
3つの任意の式を持つループに使用します.
例:
let numbers = []

for (let i=0; i<5; i++) { numbers.push(i) }
console.log(numbers) //=> [0,1,2,3,4]
注意:括弧内の式はオプションで非常に柔軟です.ループで扱う方法をカスタマイズするのは簡単です.これは、より多くの複雑な状況のためのループを偉大なオプションになります.
注意:オプション式を指定しない場合は、必ずループ内で評価して更新してください.それ以外の場合は無限ループを取得します/または予期しない結果.

while/do :
指定した条件がfalseになるまでループするために使用します.
whileループの例
let i = 0

while (i < 5) {
  console.log(‘Hi!’, i)
  i++
} //=> Hi! 0 / Hi! 1 / Hi! 2 / Hi! 3 / Hi! 4
注意:条件がループの先頭でチェックされているので、条件がすぐにfalseに評価されると、whileループは実行されません.
while whileループの例
let k = 5

do {
  console.log(‘Hi Again!’, k)
  k++
} while (k < 5) //=> Hi Again! 5
注意:この条件はループの終わりにチェックされ、ループは常に1回以上実行されます.

続行/ブレーク:
これらはループで動作するときに便利なキーワードです.

続きます:ループの次の反復にスキップします.

break :ループを終了する
これはJavaScriptで利用できるループの短い要約です.これらの重要な概念を知ると、より良いJavaScriptプログラマに役立ちます.