logo

JavaScript で配列を反復処理する

JavaScript での配列の反復処理は、開発者が頻繁に実行する基本的なタスクです。 JavaScript には、for、forEach()、map()、filter()、reduce()、for…of など、配列を反復処理するためのメソッドがいくつか用意されています。各方法には、固有の使用例、利点、ベスト プラクティスがあります。このガイドでは、これらのさまざまな配列反復メソッドを検討し、配列を効果的にループして JavaScript で要素を操作およびアクセスする方法を示します。

JavaScript で配列を反復処理するには、さまざまな方法があります。

目次



マイフリクサー

1. console.log() メソッドの使用

例: この例では、インデックス番号を使用して単純な配列要素にアクセスします。

JavaScript
let array = ['geeks', '4', 'geeks']; // Accessing array elements one by one console.log(array[0]); console.log(array[1]); console.log(array[2]);>

出力
geeks 4 geeks>

JavaScript で配列を反復処理する方法は複数あります。最も便利なものを以下に挙げます。

2. for ループの使用

for ループ 指定された条件が false になるまで、一連の命令を繰り返し実行します。これは、C/C++、Java などの他の言語のループに似ています。

例: この例では、配列の反復に for ループを使用しています。

JavaScript
let array = [1, 2, 3, 4, 5, 6]; for (let index = 0; index < array.length; index++) {  console.log(array[index]); }>

出力
1 2 3 4 5 6>

3. while ループの使用

while ループ JavaScript の は、指定されたブール条件に基づいてコードを繰り返し実行できるようにする制御フロー ステートメントです。

例: この例では、配列の反復に while ループを使用しています。

JavaScript
let index = 0; let array = [1, 2, 3, 4, 5, 6]; while (index < array.length) {  console.log(array[index]);  index++; }>

出力
1 2 3 4 5 6>

4. forEach() メソッドの使用

forEach() メソッド 指定された関数を順序内の配列要素ごとに 1 回呼び出します。

例: この例では、配列の反復に forEach() メソッドを使用しています。

JavaScript
let index = 0; let array = [1, 2, 3, 4, 5, 6]; array.forEach(myFunction); function myFunction(item, index) {  console.log(item); }>

出力
1 2 3 4 5 6>

5.every()メソッドの使用

each() メソッド 配列内のすべての要素がテスト (関数として提供) に合格するかどうかをチェックします。

Javaソート配列リスト

例: この例では、配列の反復にevery()メソッドを使用しています。

JavaScript
let x = 0; let array = [1, 2, 3, 4, 5, 6]; const under_five = x =>バツ< 5; if (array.every(under_five)) {  console.log('All are less than 5'); } else {  console.log('At least one element is not less than 5'); }>

出力
At least one element is not less than 5>

6.map()メソッドの使用

map() メソッド すべての要素に関数を適用し、新しい配列を返します。

例: この例では、配列の反復に map() メソッドを使用しています。

JavaScript
let x = 0; let array = [1, 2, 3, 4, 5, 6]; let square = x =>Math.pow(x, 2);正方形 = 配列.マップ(正方形);コンソール.ログ(配列);コンソール.ログ(正方形);>>

出力
[ 1, 2, 3, 4, 5, 6 ] [ 1, 4, 9, 16, 25, 36 ]>

7. filter() メソッドの使用

filter() メソッド 配列から値をフィルタリングし、新しいフィルタリングされた配列を返すために使用されます。

例: この例では、配列の反復に filter() メソッドを使用しています。

JavaScript
let array = [1, 2, 3, 4, 5, 6]; let even = x =>x % 2 === 0; let Evens = array.filter(even);コンソール.ログ(配列); console.log(evens);>>

出力
[ 1, 2, 3, 4, 5, 6 ] [ 2, 4, 6 ]>

8.reduce()メソッドの使用

reduce() メソッド 関数ロジックを使用して配列を 1 つの値に減らすために使用されます。

Javaでの現在の日付

例: この例では、配列の反復にreduce()メソッドを使用しています。

JavaScript
let array = [1, 2, 3, 4, 5, 6]; const helperSum = (acc, curr) =>acc + カーソル; const sum = array.reduce(helperSum, 0); console.log(配列) console.log(合計);>>

出力
[ 1, 2, 3, 4, 5, 6 ] 21>

9. some() メソッドの使用

some() メソッド 一部の配列値がテストに合格するかどうかを確認するために使用されます。

例: この例では、配列の反復に some() メソッドを使用しています。

JavaScript
let array = [1, 2, 3, 4, 5, 6]; const lessthanFourCheck = (element) =>要素< 4; const lessthanFour = array.some(lessthanFourCheck); console.log(array); if (lessthanFour) {  console.log('At least one element is less than 4') } else {  console.log('All elements are greater than 4 ') }>

出力
[ 1, 2, 3, 4, 5, 6 ] At least one element is less than 4>

10.entrys() メソッドの使用

events() メソッドは、配列内の各インデックスのキーと値のペアを含む新しい Array Iterator オブジェクトを返します。これを使用して、各要素のインデックスと値の両方にアクセスできます。

例: この例では、配列の反復に events() メソッドを使用しています。

JavaScript
let array = [1, 2, 3, 4, 5, 6]; for (let [index, value] of array.entries()) {  console.log(index, value); }>

出力
0 1 1 2 2 3 3 4 4 5 5 6>