SYNCERのロゴ
アイキャッチ画像

Array.prototype.reduceRight() - 配列を後方から簡約化する

Array.prototype.reduceRight()は、配列の要素を後方から前方にかけて簡約化するメソッドです。各要素をコールバック関数にかけて最終的に1つの値にまとめます。

概要

名前
reduceRight
所属
Array.prototype
仕様書
https://tc39.github.io/ecma262/#sec-array.prototype.reduceright

説明

Array.prototype.reduceRight ( callbackfn [ , initialValue ] )

第1引数(callbackfn)にコールバック関数を指定します。最初に配列の[length-1]と[length-2]が引数に関数にかけられ、次にその返り値と[length-3]が関数にかけられ、次のその返り値と[length-4]が関数にかけられ…、といった形で各要素に処理が実行されて、最終的な1つの返り値を決定します。このコールバック関数は、前回の返り値、今回の値、今回の値のインデックス番号、元の配列、の4つの引数を受け取ります。

第2引数(initialValue)を指定すると、それが初期値に設定されます。最初に[length-1]と[length-2]ではなく、initialValueと[length-1]が関数にかけられます。

function callbackfn ( lastValue, value, index, array ) {
	return lastValue + value ;
}

チュートリアル

例えば、配列の各要素を乗算する、というテーマでArray.prototype.reduceRight()を利用してみます。コールバック関数は、前回の値に、今回の値をかけた値を返すようにします。

// 6 * 5 * 4 * 3 * 2 * 1をしたい
var array = [ 1, 2, 3, 4, 5, 6, ] ;

var callbackfn = function ( lastValue, value, index, sourceArray ) {
	return lastValue * value ;
}

array.reduceRight( checkFunc ) ;	// 720

処理は内部で次のように繰り返されます。このように、各要素が1つの値に簡約化されていきます。

callbackfn( 6, 5, 4, array ) ;	// 6 * 5 = 30		array[5] と array[4]
callbackfn( 30, 4, 3, array ) ;	// 30 * 4 = 120		前回の返り値(30) と array[3]
callbackfn( 120, 3, 2, array ) ;	// 120 * 3 = 360			前回の返り値(120) と array[2]
callbackfn( 360, 2, 1, array ) ;	// 360 * 2 = 720			前回の返り値(360) と array[1]
callbackfn( 120, 1, 0, array ) ;	// 720 * 1 = 720			前回の返り値(720) と array[0]

// → 720

デモ

Array.prototype.reduceRight()のデモです。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<html>
<head>
	<style>
body {
	white-space: pre-wrap ;
}
	</style>
</head>
<body>
<script>
/** try it! **/
var callbackfn = function ( lastValue, value, index, sourceArray ) {
	return value * lastValue ;
}

var a = [ 1, 2, 3, 4, 5, 6, ].reduceRight( callbackfn ) ;
var b = [ 1, 2, 3, 4, 5, 6, ].reduceRight( callbackfn, 10 ) ;
/** try it! **/

var results = { a:a, b:b, } ;

for( var name in results ) {
	console.log( name, results[name] ) ;
	document.body.appendChild( new Text( name + " = " + JSON.stringify( results[name] ) + "\n" ) ) ;
}
</script>
</body>
</html>

サポート状況

ChromeFirefoxSafariEdgeIEOperaiOS SafariAndroid
9+
  • Twitterでシェア
  • Facebookでシェア
  • Google+でシェア
  • はてなブックマークでシェア
  • pocketに保存
  • LINEでシェア
更新履歴
2017年9月26日 (火)
コンテンツを公開しました。