配列要素へのアクセスに関する基本知識
インデックスを使用して配列要素にアクセスする基本から始めましょう。 JavaScript での配列のインデックス付けは 0 から始まります。これは、コード内で array_name[0] を使用して最初の要素にアクセスできることを意味します。同様に、n 要素を含む配列の場合、array_name[n - 1] を使用して最後の要素にアクセスできます。
リーリー
for ループを使用して反復します
配列をループする最も一般的な方法の 1 つは、for ループです。 for ループは反復変数を 0 に初期化し、最初の要素からループを開始します。配列全体を反復処理する必要があるため、配列の長さを計算する必要があります。これは、length プロパティを使用して簡単に実行できます。配列内の最後の要素には、array_name[length - 1] を使用してアクセスできます。
次のコード スニペットは、for ループ シーケンスを使用して配列をループする方法を示しています。
リーリー
ループ終了条件として、以下演算子 () の代わりに、未満演算子 () を使用していることに注意してください。
配列をループするときに for ループを使用すると、2 つの利点があります。広くサポートされていることと、break および ## を通じてループのフローを制御できることです。 #Continue ステートメント。探しているものが見つかったら、ループを終了できます。 for ループは、非同期コードを扱う場合にもうまく機能します。
欠点は、少し冗長であり、時折小さな間違いを犯す可能性があることです。
forEach() メソッドを使用して反復します
組み込みの forEach() メソッドを使用して、JavaScript で配列を反復処理することもできます。このメソッドは、配列要素ごとに 1 回実行されるコールバック関数を引数として受け取ります。コールバック関数は別の場所で定義でき、インライン関数またはアロー関数にすることができます。
コールバック関数は 3 つの異なるパラメータを受け入れることができます:
現在の要素自体
- 現在の要素のインデックス
- メソッドの
forEach()- 配列を呼び出します
リーリー
ご覧のとおり、 forEach() メソッドを使用するとコードがきれいになります。次に、コールバック関数の 2 番目のパラメーターを使用する別の例を示します。
リーリー
forEach() の使用は、配列の単純な反復に非常に適しています。ただし、break および Continue を使用してループを途中で終了し、プログラムの流れを変更することはできません。 forEach() を使用するもう 1 つの欠点は、このメソッドでは非同期コードを使用できないことです。
for...of ループを使用して反復します
ES6 標準では、JavaScript に多くの新機能が追加されています。その 1 つは、反復子と反復可能オブジェクトの概念です。 for...of ループを使用すると、@@iterator メソッドを実装するオブジェクトの値を反復処理できます。組み込み型 (Array、String、Set、Map など) は、for...of ループを使用して値を反復処理できます。
リーリー
構造を使用して反復することには多くの利点があります。たとえば、これを使用して他の組み込みの反復可能な型を反復することもできます。とりわけ、break または Continue ステートメントを使用して、ループから抜け出し、プログラム フローを制御できます。
唯一の潜在的な欠点は、ブラウザのサポートが若干少ないことですが、それはすべて対象ユーザーによって異なります。
for...in ループを使用して反復します
for...in ステートメントを使用して配列をループすることもできます。これは、オブジェクトのすべての列挙可能な文字列プロパティをループします。これには、継承された列挙可能なプロパティも含まれます。
ここで言及したいのは、ループを反復するために for...in ステートメントを使用することは推奨されないということです。これは、前に述べたように、このステートメントは、継承されている場合でも、すべての整数プロパティと非整数プロパティを反復処理するためです。配列を反復処理する場合、通常は整数キーのみに関心があります。
for...in ループの走査順序は明確に定義されており、負でない整数キーの走査から始まります。負でない整数キーは、値の昇順で走査されます。次に、他の文字列キーを作成された順序で繰り返します。
スパース配列は、他のメソッドよりも for...in ループを使用してより適切に走査できる配列タイプです。たとえば、 for...of ループはスパース配列内のすべての空のスロットを反復処理しますが、for...in ループは反復しません。
これは、for...in ループを使用してスパース配列を反復処理する例です:
リーリー
Object.hasOwn() という静的メソッドを使用して、クエリ オブジェクトの指定されたプロパティが実際に独自のプロパティであるかどうかを確認していることに気づいたかもしれません。
＃＃＃最終的な考え＃＃＃
通常の for ループをいつでも使用して、配列を反復処理できます。 break および Continue キーワードを使用してプログラム フローを制御でき、非同期コードもサポートされます。一方で、1 つの間違いについては注意する必要があります。 <p><code>forEach() メソッドは配列をループする短い方法を提供しますが、非同期コードには適していません。また、break と continue を使用してループを抜けたり、プログラム フローを制御したりすることもできません。
for...of ループは両方の長所を提供します。プログラム フローを完全に制御でき、非同期コードでも動作します。ビートを逃す心配はありません。
最後に、for...in ループは、配列をループする推奨される方法ではありません。ただし、ループする配列が非常にまばらな場合には便利です。
この記事のサムネイルは、OpenAI の DALL-E 2 を使用して生成されました。
|
