JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのArray.reduceRight()メソッドとは？使い方と実行例を解説

Array.reduceRight()メソッドの基本

Array.reduceRight()は、JavaScriptに標準で組み込まれている配列メソッドの一つです。配列の各要素を右から左へ（末尾から先頭へ）順番に処理し、それらを最終的に単一の値へとまとめる（畳み込む）ために使用されます。

このメソッドのコールバック関数には、「前回の値（previousValue）」と「現在の値（currentValue）」という2つの引数が渡されます。処理は配列の末尾側から開始され、各ステップでの計算結果が次のステップへ引き継がれていく仕組みです。

なお、よく似たメソッドであるreduce()は配列の先頭から処理を行うのに対し、reduceRight()は末尾から処理を行う点が最大の違いです。そのため、処理順序が結果に影響する場合（文字列の連結や配列の結合など）には、どちらを使うかが重要になります。

サンプルコード

以下の例では、3つの配列を要素として持つネストされた配列に対してreduceRight()を適用しています。concat()で各配列を連結することにより、すべての要素が右から左の順序で1つのグループ（9,10,x,y,z,1,2,3）へとまとめられます。

<html>
<body>
<script>
    const Arr = [ [ 1, 2, 3 ], [ "x", "y", "z" ], [ 9, 10 ] ];
    array = Arr.reduceRight((previousValue, currentValue) => previousValue.concat(currentValue));
    document.write(array);
</script>
</body>
</html>

出力結果

9,10,x,y,z,1,2,3

処理の流れ

このコードでは、以下のような流れで処理が進みます。

1回目：previousValue = [9, 10]、currentValue = ["x", "y", "z"] → 結果：[9, 10, "x", "y", "z"]
2回目：previousValue = [9, 10, "x", "y", "z"]、currentValue = [1, 2, 3] → 最終結果：9,10,x,y,z,1,2,3

このように、reduceRight()は配列の末尾から順に処理を積み重ねていくため、要素の並び順が元の配列とは逆になった状態で結果が出力されるのが特徴です。初期値を指定すれば、任意の値を出発点として畳み込み処理を行うことも可能です。

  1. 【初心者向け】JavaScriptのArray.from()メソッドの使い方を実例で解説

    JavaScript の Array.from() メソッドは、length プロパティを持つオブジェクト（配列風オブジェクト）や、文字列・Map・Set などの反復可能（イテラブル）なオブジェクトから、新しい Array オブジェクトを生成して返すためのメソッドです。元のオブジェクトは変更されず、常に新しい配列インスタンスが返されます。 基本構文 Array.from(obj, mapFunction, val) パラメータの説明 obj：配列へ変換したい対象のオブジェクト。配列風オブジェクト（length プロパティを持つもの）や反復可能なオブジェクトを指定します。 mapFunctio

  2. JavaScriptのreduce()メソッドを使って配列の平均値を求める方法

    JavaScriptでは、数値の配列を受け取り、そのすべての要素の平均値を計算する関数が必要になる場面がよくあります。通常であればforループなどで合計を求めてから要素数で割るのが一般的ですが、今回はArray.prototype.reduce()メソッドのみを使用するという条件のもとで実装してみましょう。reduce()メソッドによる平均値の計算reduce()メソッドは、配列の各要素に対してコールバック関数（リデューサー）を実行し、単一の結果に集約するための高階関数です。リデューサー関数は以下の4つの引数を受け取ることができます。acc（アキュムレータ）：前回のコールバック実行時の戻り値（