JavaScript - 配列を逆順にループする方法

JavaScript で配列をループする場合、通常は先頭から順番にループさせますが、 場合によっては最後から(逆順に)ループさせたい場合があります。

ここでは、for 文や reverse() を使って、配列を逆順にループする方法を紹介します。

for 文を使った逆順のループ

次のサンプルコードは for 文を使った逆順のループです。

for 文で必要となる初期化式、条件式、更新式は次の通りです。

初期化式配列の長さ - 1
条件式インデックスが 0 以上
更新式インデックスを -1

var arr = [1, 2, 3, 4, 5];
var len = arr.length;

for (var i = len - 1; i >= 0 ; i--){
	console.log(arr[i]);
}

// 実行結果
5
4
3
2
1

サンプルコードの説明

配列のインデックスの最後からループを開始するので初期化式は「len - 1」となります。

配列のインデックスが 0 以上の場合は処理を継続するので条件式は「i >= 0」となります。

逆順にループするので更新式は「i--」とデクリメントします。

このように処理を行うことで逆順にループできます。

reverse() を使った逆順のループ

次のサンプルコードは、reverse() を使った逆順のループです。

reverse() メソッドを実行した時点で、配列 arr の順序が入れ替わります。

ですから、あとは配列の先頭(最初)からループするだけで逆順に取得できます。


var arr = [1, 2, 3, 4, 5];

// 逆順にする
arr.reverse();
console.log(arr); // Array [ 5, 4, 3, 2, 1 ]

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

// 実行結果
5
4
3
2
1

まとめ

★ 配列を逆順に(最後から)ループすることもできます。

★ for 文や reverse() を使って実現できます。

★ for 文の場合は初期化式、条件式、更新式に注意します。