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

JavaScriptのreduce()メソッドで配列の値を左から右へ処理し、1つの値にまとめる方法

JavaScriptでは、reduce()メソッドを使用することで、配列の2つの値に対して左から右へ順番に関数を適用し、最終的に結果を1つの値にまとめる（畳み込む）ことができます。配列の合計値の計算など、複数の要素を集約したい場面で非常に便利なメソッドです。

reduce()メソッドの主な引数

  • callback − 配列内の各値に対して実行される関数です。
  • initialValue − callbackの最初の呼び出し時に第1引数として渡される初期値（オブジェクト）です。省略した場合は、配列の最初の要素が初期値として使用されます。

サンプルコード

以下のコードを実行すると、JavaScriptのreduce()メソッドの基本的な動作を確認できます。この例では、古いブラウザ向けのポリフィル実装も含めており、配列[0, 1, 2, 3]の全要素を足し合わせた合計値を出力します。

<html>
   <head>
      <title>JavaScript Array reduce Method</title>
   </head>

   <body>
      <script>
         if (!Array.prototype.reduce) {
            Array.prototype.reduce = function(fun /*, initial*/) {
               var len = this.length;
               if (typeof fun != "function")
               throw new TypeError();
               
               // no value to return if no initial value and an empty array
               if (len == 0 && arguments.length == 1)
               throw new TypeError();
               var i = 0;
               
               if (arguments.length >= 2) {
                  var rv = arguments[1];
               } else {
                  do {
                     if (i in this) {
                        rv = this[i++];
                        break;
                     }
                     // if array contains no values, no initial value to return
                     if (++i >= len)
                     throw new TypeError();
                 }
                 while (true);
               }
               for (; i < len; i++) {
                  if (i in this)
                  rv = fun.call(null, rv, this[i], i, this);
               }
               return rv;
            };
         }
         var total = [0, 1, 2, 3].reduce(function(a, b){ return a + b; });
         document.write("total is : " + total );
      </script>
   </body>
</html>

実行結果

このコードを実行すると、画面には以下のように表示されます。

total is : 6

このように、reduce()メソッドはコールバック関数を通じて配列の要素を左から右へ順に処理し、単一の値へと集約することができます。現代のブラウザではreduce()は標準でサポートされているため、通常はポリフィルなしでそのまま利用可能です。

  1. 【C#】メソッドから複数の値を返す4つの方法（ref・out・配列・タプル）

    C#では、1つのメソッドから複数の値を返したい場面がよくあります。C#には主に以下の4つのアプローチがあります。ref（参照）パラメータを使うout（出力）パラメータを使う配列を返すタプル（Tuple）を返すそれぞれの方法について、コード例と実行結果とともに詳しく解説します。1. ref（参照）パラメータを使う方法ref キーワードを使うと引数を参照渡しでき、メソッド内で変更した値が呼び出し元にも反映されます。通常の戻り値と組み合わせることで、実質的に2つの値を受け取ることが可能です。なお、ref 引数に渡す変数は、呼び出し前に初期化しておく必要があります。コード例class Program{

  2. C#の2次元配列から要素にアクセスする方法を徹底解説

    2次元配列は、x個の行とy個の列を持つ「表（テーブル）」としてイメージすると理解しやすくなります。2次元配列の要素へアクセスするには、添字（インデックス）を使用します。具体的には、配列の行インデックスと列インデックスを指定します。int x = a[1,1]; Console.WriteLine(x);C#では、カンマで区切って a[行, 列] の形式で記述することにより、任意の位置にある要素を取得できます。上記の例では、1行1列の位置にある要素を変数 x に代入し、コンソールに出力しています。サンプルコード以下の例では、5行2列の2次元配列を作成し、入れ子になったforループですべての要素を