JavaScriptで配列の要素を逆順に並び替えたい場合、reverse()メソッドを使用します。今回は、reverse()の基本的な使い方から使用時の注意点までをまとめていきたいと思います。
目次 非表示
reverse()メソッドは、配列の要素の順番を反転（逆順に並び替え）するメソッドです。
JavaScript
array.reverse();| 特徴 |
|---|
| 元の配列を変更（破壊的）する |
| 戻り値は逆順に並び替えられた配列 |
JavaScript
const numbers = [1, 2, 3, 4, 5];
numbers.reverse();
console.log(numbers); // [5, 4, 3, 2, 1]配列numbersの要素順を逆にします。元の配列が変更される（破壊的処理） ため、numbers自体が逆順になります。
JavaScript
const str = 'hello';
const reversedStr = str.split('').reverse().join('');
console.log(reversedStr); // 'olleh'split('')で文字列を1文字ずつの配列 ['h', 'e', 'l', 'l', 'o']にします。reverse()で配列の順番を逆にし、join('')で配列を文字列に戻します。
JavaScript
const colors = ['red', 'blue', 'green'];
const reversedColors = [...colors].reverse();
console.log(colors); // red, blue, green（元の配列は変更なし）
console.log(reversedColors); // green, blue, red（逆順の新しい配列）reverse()は元の配列を変更するため、スプレッド構文 [...colors] を使ってコピーを作成し、元の配列を保持します。
JavaScript
const numbers = [10, 5, 8, 1, 3];
numbers.sort((a, b) => a - b).reverse();
console.log(numbers); // [10, 8, 5, 3, 1]sort((a, b) => a - b)で昇順に並び替え、reverse()で逆順にすることで、降順に並び替えられます。
JavaScript
const stack = [];
stack.push('A');
stack.push('B');
stack.push('C');
console.log(stack.reverse().pop()); // 'A'（LIFOの最初の要素）reverse()を使うと、スタック（後入れ先出し LIFO）の順序を変えられます。
reverse()を使用すると、元の配列の順序が変更されるため、元の配列を残したい場合はコピーを作成する。
JavaScript
const original = [1, 2, 3, 4, 5];
const reversed = [...original].reverse();
console.log(original); // [1, 2, 3, 4, 5]（変更なし）
console.log(reversed); // [5, 4, 3, 2, 1]JavaScript
console.log([].reverse()); // []（空配列はそのまま）
console.log(null.reverse()); // エラー！reverse()は 配列でのみ使用可能です。nullやundefinedには適用できないため、事前にチェックする必要があります。
reverse()は 配列の順番を反転させるメソッドです- 元の配列を変更する（破壊的処理） ので、コピーを作成したい場合は
[...]を使いましょう - 文字列の逆順は
split()→reverse()→join()を組み合わせます - 降順ソートは
sort()+reverse()で実現できます
