JavaScriptのreverseの使い方！配列を逆順にする

JavaScriptで配列の要素の順番を逆にするreverseメソッドについて書いています。

reverseメソッドを使うと、配列の要素の順番を簡単に逆順にすることができます。
配列の要素を並び替えたり、逆順に処理したりする場合に便利です。

実際に動くサンプルを使って、以下の操作を解説します。

reverseメソッドの基本的な使い方

reverseメソッドは、配列の要素の順番を逆順にします。
基本的な構文は以下のとおりです。

array.reverse()

配列要素の順番を逆にする

文字列の配列の順序を逆にしてみます。

const fruits = ['apple', 'banana', 'orange'];
fruits.reverse();

console.log(fruits); // 結果：['orange', 'banana', 'apple']

fruits配列を作成して、reverseメソッドを呼んでいます。

こうすると、配列の要素の順番がreverseメソッドによって逆順になります。
reverseメソッドは、元の配列を直接変更することに注意してください。

元の配列を変えずに逆順にする

reverseメソッドは元の配列を直接変更しますが、スプレッド構文(...)を使うことで、元の配列を変更せずに逆順にした新しい配列を作成できます。

const fruits = ['apple', 'banana', 'orange'];
const reversedFruits = [...fruits].reverse();

console.log(fruits); // 結果：['apple', 'banana', 'orange'] (元の配列は変わらない)
console.log(reversedFruits); // 結果：['orange', 'banana', 'apple'] (新しい配列)

fruits配列をスプレッド構文でコピーし、コピーした配列に対してreverseメソッドを適用しています。
そして、戻り値でreversedFruits配列を作成しています。

結果を確認すると、元のfruits配列は変更されず、逆順になった新しい配列reversedFruitsが作成されました。

JavaScriptのreverseメソッドの使い方まとめ

今回はJavaScriptのreverseメソッドの使い方について解説しました。
記事の内容をまとめます。