JavaScript reduce の使い方 #4

JavaScript reduce の使い方 #1JavaScript reduce の使い方 #2JavaScript reduce の使い方 #3 で reduce の使い方をまとめてきました。map のときと同様、reduce のまとめで使った関数をアロー関数で記述してみます。掲載するソースコードはすべて GAS の開発環境で動作確認をしています。

アロー関数を使おうと使わなかろうと同じ結果となりますし、どちらが正しい、というわけでは無いです。状況により使い分ければと思います。

function myFunction1() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( function( accumulator, currentValue, index, array ) {
                      console.log( accumulator, currentValue, index, array ) ;
                    } );
}

function myFunction_arrow1() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( ( accumulator, currentValue, index, array ) => console.log( accumulator, currentValue, index, array ) );
}

// 実行結果
// accumulator currentValue index array
// 1            3           1     [ 1, 3, 10, 17, 20, 31 ]
// undefined   10           2     [ 1, 3, 10, 17, 20, 31 ]
// undefined   17           3     [ 1, 3, 10, 17, 20, 31 ]
// undefined   20           4     [ 1, 3, 10, 17, 20, 31 ]
// undefined   31           5     [ 1, 3, 10, 17, 20, 31 ]
function myFunction2() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( function( accumulator, currentValue, index, array ) {
                      console.log( accumulator, currentValue, index, array ) ;
                      return currentValue ;
                    } );
}

function myFunction_arrow2() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;
 
 inputArray.reduce( ( accumulator, currentValue, index, array ) => {
                        console.log( accumulator, currentValue, index, array ) ;
                        return currentValue ;
                      }
                  );
}


// 実行結果
// accumulator currentValue index array
//  1           3           1     [ 1, 3, 10, 17, 20, 31 ]
//  3          10           2     [ 1, 3, 10, 17, 20, 31 ]
// 10          17           3     [ 1, 3, 10, 17, 20, 31 ]
// 17          20           4     [ 1, 3, 10, 17, 20, 31 ]
// 20          31           5     [ 1, 3, 10, 17, 20, 31 ]
function sumByReduce() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( function( accumulator, currentValue, index, array ) {
                      console.log( accumulator, currentValue, index, array ) ;
                      return accumulator + currentValue ;
                    } );
}

function sumByReduce_arrow() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( ( accumulator, currentValue, index, array ) => {
                        console.log( accumulator, currentValue, index, array ) ;
                        return accumulator + currentValue ;
                    } );
}

// 実行結果
// accumulator currentValue index array
//  1           3           1     [ 1, 3, 10, 17, 20, 31 ]
//  4          10           2     [ 1, 3, 10, 17, 20, 31 ]
// 14          17           3     [ 1, 3, 10, 17, 20, 31 ]
// 31          20           4     [ 1, 3, 10, 17, 20, 31 ]
// 51          31           5     [ 1, 3, 10, 17, 20, 31 ]
function sumX2ByReduceCorrect() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( function( accumulator, currentValue, index, array ) {
                      console.log( accumulator, currentValue, index, array ) ;
                      return accumulator + currentValue * 2 ;
                    }, 0 );
}

function sumX2ByReduceCorrect_arrow() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( ( accumulator, currentValue, index, array ) => {
                        console.log( accumulator, currentValue, index, array ) ;
                        return accumulator + currentValue * 2 ;
                    }, 0 );
}

// 実行結果
// accumulator   currentValue index array
//   0            1           0     [ 1, 3, 10, 17, 20, 31 ]
//   2([]+1x2)    3           1     [ 1, 3, 10, 17, 20, 31 ]
//   8(2+3x2)    10           2     [ 1, 3, 10, 17, 20, 31 ]
//  28(8+10x2)   17           3     [ 1, 3, 10, 17, 20, 31 ]
//  62(28+17x2)  20           4     [ 1, 3, 10, 17, 20, 31 ]
// 102(62+20x2)  31           5     [ 1, 3, 10, 17, 20, 31 ]
function checkEvenReduce() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( function( accumulator, currentValue, index, array ) {
                      console.log( accumulator, currentValue, index, array ) ;
                      if ( currentValue % 2 === 0 )
                        accumulator.push( currentValue );
                      return accumulator ;
                    }, [] );
}

function checkEvenReduce_arrow() {
 const inputArray = [ 1, 3, 10, 17, 20, 31 ] ;

 inputArray.reduce( ( accumulator, currentValue, index, array ) => {
                        console.log( accumulator, currentValue, index, array ) ;
                        if ( currentValue % 2 === 0 )
                          accumulator.push( currentValue );
                        return accumulator ;
                    }, [] );
}

// 実行結果
// accumulator currentValue index array
// []           1            0     [ 1, 3, 10, 17, 20, 31 ]
// []           3            1     [ 1, 3, 10, 17, 20, 31 ]
// []          10            2     [ 1, 3, 10, 17, 20, 31 ]
// [ 10 ]      17            3     [ 1, 3, 10, 17, 20, 31 ]
// [ 10 ]      20            4     [ 1, 3, 10, 17, 20, 31 ]
// [ 10, 20 ]  31            5     [ 1, 3, 10, 17, 20, 31 ]
function sampleReduce() {
 const inputArray = [ ['A', 50 ], ['B', 50 ], ['C', 50 ], ['A', 70 ], ['B', 80 ], ['C', 90 ], ['A', 100 ] ] ;

 const returnValue = 
 inputArray.reduce( function( accumulator, currentValue, index, array ) {
                      console.log( accumulator, currentValue, index, array ) ;
                      if ( currentValue[ 0 ]  === 'A' )
                        accumulator += currentValue[ 1 ];
                      return accumulator ;
                    }, 0 );
 console.log( returnValue );
}

function sampleReduce() {
 const inputArray = [ ['A', 50 ], ['B', 50 ], ['C', 50 ], ['A', 70 ], ['B', 80 ], ['C', 90 ], ['A', 100 ] ] ;

 const returnValue = 
 inputArray.reduce( ( accumulator, currentValue, index, array ) => {
                        console.log( accumulator, currentValue, index, array ) ;
                        if ( currentValue[ 0 ]  === 'A' )
                          accumulator += currentValue[ 1 ];
                        return accumulator ;
                    }, 0 );
 console.log( returnValue );
}

// 実行結果
// accumulator currentValue index arrray
//   0         ['A', 50 ]   0     [['A', 50], ['B', 50], ['C', 50], ['A', 70], ['B', 80], ['C', 90], ['A', 100]]
//  50         ['B', 50 ]   1     [['A', 50], ['B', 50], ['C', 50], ['A', 70], ['B', 80], ['C', 90], ['A', 100]]
//  50         ['C', 50 ]   2     [['A', 50], ['B', 50], ['C', 50], ['A', 70], ['B', 80], ['C', 90], ['A', 100]]
//  50         ['A', 70 ]   3     [['A', 50], ['B', 50], ['C', 50], ['A', 70], ['B', 80], ['C', 90], ['A', 100]]
// 120         ['B', 80 ]   4     [['A', 50], ['B', 50], ['C', 50], ['A', 70], ['B', 80], ['C', 90], ['A', 100]]
// 120         ['C', 90 ]   5     [['A', 50], ['B', 50], ['C', 50], ['A', 70], ['B', 80], ['C', 90], ['A', 100]]
// 120         ['A',100 ]   6     [['A', 50], ['B', 50], ['C', 50], ['A', 70], ['B', 80], ['C', 90], ['A', 100]]
// 220

では、ごきげんよう。


この記事が気に入ったらサポートをしてみませんか?