JavaScriptで配列の要素の順番を逆にした新しい配列を返すtoReversed
メソッドについて書いています。
toReversed
メソッドを使うと、元の配列を変更せずに、要素の順番が逆になった新しい配列を作成できます。
配列の要素を逆順に処理したり、逆順にした配列を別の処理に渡したりする場合に便利です。
実際に動くサンプルを使って、以下の操作を解説します。
・`toReversed`メソッドの基本的な使い方
・`toReversed`メソッドを使うメリット
・`reverse`メソッドとの違い
・`toReversed`メソッドを使うメリット
・`reverse`メソッドとの違い
toReversedメソッドの基本的な使い方
toReversed
メソッドは、配列の要素の順番を逆にした新しい配列を返します。
元の配列は変更されません。
基本的な構文は以下のとおりです。
array.toReversed()
配列要素の順番を逆にした新しい配列を作成する
toReversed
メソッドを使って、配列を逆順にしてみます。
const fruits = ['apple', 'banana', 'orange'];
const reversedFruits = fruits.toReversed();
console.log(fruits); // 結果:['apple', 'banana', 'orange'] (元の配列は変わらない)
console.log(reversedFruits); // 結果:['orange', 'banana', 'apple'] (新しい配列)
fruits
配列を作成して、toReversed
を呼び出しています。
そして、配列要素の順番がtoReversed
メソッドによって、逆順になった新しい配列reversedFruits
が作成されています。
元のfruits
配列は変更されていません。
toReversedメソッドを使うメリット
toReversed
メソッドを使う主なメリットは以下のとおりです。
- 元の配列を変更せずに逆順にした新しい配列を作成できる: 元の配列を変更せずに、逆順にした新しい配列を作成できます。
- 可読性の向上:
toReversed
メソッドを使うことで、配列を逆順にする処理がより明確になり、コードの可読性が向上します。
reverseメソッドとの違い
配列の要素の順番を逆にするメソッドとしては、reverse
メソッドも存在します。
reverse
メソッドは、元の配列を直接変更するのに対し、toReversed
メソッドは元の配列を変更せずに新しい配列を返す点が異なります。
メソッド | 処理内容 | 元の配列 |
---|---|---|
reverse |
配列の要素の順番を逆にする | 変更される |
toReversed |
配列の要素の順番を逆にした新しい配列を返す | 変更されない |
どちらのメソッドを使うかは、元の配列を変更したいかどうかによって選択する必要があります。
console.log("--- reverseを使用 ---");
const fruits1 = ['apple', 'banana', 'orange'];
fruits1.reverse();
console.log(fruits1); // 結果: ['orange', 'banana', 'apple']
console.log("--- toReversedを使用 ---");
const fruits2 = ['apple', 'banana', 'orange'];
const reverseFruits = fruits2.toReversed();
console.log(fruits2); // 結果: ['apple', 'banana', 'orange'] => toReversedは元の配列を変更しない
console.log(reverseFruits); // 結果: ['orange', 'banana', 'apple'] => 戻り値で変更された配列を受け取る
JavaScriptのtoReversedメソッドの使い方まとめ
今回はJavaScriptのtoReversed
メソッドの使い方について解説しました。
記事の内容をまとめます。
・`toReversed`メソッドは、配列の要素の順番を逆にした新しい配列を返す。
・元の配列は変更されない。
・`reverse`メソッドは元の配列を直接変更する。
・元の配列は変更されない。
・`reverse`メソッドは元の配列を直接変更する。
コメント