Movatterモバイル変換


[0]ホーム

URL:


MDN Web Docs

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

Array.prototype.reduceRight()

BaselineWidely available

reduceRight()Array インスタンスのメソッドで、アキュームレーターと配列のそれぞれの値に対して(右から左へ)関数を適用して、単一の値にします。

左から右へ適用する場合はArray.prototype.reduce() を参照してください。

試してみましょう

const array1 = [  [0, 1],  [2, 3],  [4, 5],];const result = array1.reduceRight((accumulator, currentValue) =>  accumulator.concat(currentValue),);console.log(result);// Expected output: Array [4, 5, 2, 3, 0, 1]

構文

js
reduceRight(callbackFn)reduceRight(callbackFn, initialValue)

引数

callbackFn

配列の各要素に対して実行される関数です。その返値は、次にcallbackFn を呼び出す際のaccumulator 引数の値になります。最後の呼び出しでは、返値はreduceRight() の返値となります。この関数は以下の引数で呼び出されます。

accumulator

前回のcallbackFn の呼び出し結果の値です。初回の呼び出しではinitialValue が指定されていた場合はその値、そうでない場合はこの配列の末尾の要素の値です。

currentValue

現在の要素の値です。初回の呼び出しではinitialValue が指定された場合は末尾の要素の値であり、そうでない場合は末尾から 2 番目の要素の値です。

currentIndex

currentValue のインデックス位置です。初回の呼び出しでは、initialValue が指定された場合はarray.length - 1、そうでない場合はarray.length - 2 です。

reduceRight() が呼び出された配列です。

initialValue省略可

callbackFn の最初の呼び出しのときに、アキュームレーターとして使用する値です。初期値がが渡されなかった場合は、配列の最後の要素が適用され、その要素が飛ばされます。また、reduceRight() を空の配列に対して初期値なしで呼び出すとTypeError になります。

返値

畳み込みによって得られた値です。

解説

reduceRight() メソッドは反復処理メソッドです。「縮小」コールバック関数を配列に含まれる各要素に対して昇順に一度ずつ呼び出し、その結果を単一の値に積算します。

callbackFn は値が割り当てられている配列インデックスに対してのみ呼び出されます。疎配列の空のスロットに対しては呼び出されません。

他の反復処理メソッドとは異なり、reduceRight()thisArg 引数を受け入れません。callbackFn は常にundefinedthis として呼び出され、callbackFn が厳格モードでない場合はglobalThis に置き換えられます。

reduceRight() メソッドは呼び出し元の配列を変更しませんが、callbackFn に指定された関数は変更することがあります。ただし、配列の長さはcallbackFn を最初に呼び出す前に保存されることに注意してください。したがって、

  • callbackFnreduceRight() の呼び出しを始めたときの配列の長さを超えて追加された要素にはアクセスしません。
  • 既に処理したインデックスを変更しても、callbackFn が再度呼び出されることはありません。
  • まだ処理していない既存の配列要素がcallbackFn によって変更された場合、callbackFn に渡される値はその要素が取得される時点の値になります。削除された要素はundefined であるかのように処理されます。

警告:前項で説明したような、参照中の配列の同時進行での変更は(特殊な場合を除いて)普通は避けるべきです。多くの場合、理解しにくいコードになります。

reduceRight() メソッドは汎用的です。これはthis 値にlength プロパティと整数キーのプロパティがあることだけを期待します。

初期値がない場合の reduceRight() の動作

reduceRight のcallbackFn の呼び出しは次のようになります:

js
arr.reduceRight((accumulator, currentValue, index, array) => {  // …});

関数が初めて呼び出されたとき、accumulatorcurrentValue は、2 つの値のいずれかになります。initialValue を指定してreduceRight を呼び出した場合、accumulatorinitialValue と等しくなり、currentValue は配列の最後の値と等しくなります。initialValue が指定されなかった場合、accumulator は配列の最後の値に等しく、currentValue は最後から 2 番目の値に等しくなります。

配列が空で、initialValue が指定されなかった場合は、TypeError が発生します。配列に (位置に関わらず) 要素が 1 つしかなく、initialValue が指定されなかった場合、またはinitialValue が指定されたが配列が空だった場合は、callbackFn を呼び出されずに単独の値が返されます。

この関数を使用した場合について見てみましょう。

js
[0, 1, 2, 3, 4].reduceRight(  (accumulator, currentValue, index, array) => accumulator + currentValue,);

コールバックは 4 回呼び出され、ぞれぞれの呼び出しの引数と返値は次のようになります。

accumulatorcurrentValueindexReturn value
First call4337
Second call7229
Third call91110
Fourth call100010

reduceRight の返値は、コールバック呼び出しの最後の返値である (10) になります。

初期値がある場合の reduceRight() の動作

ここでは、同じアルゴリズムを使用して同じ配列を縮小しますが、reduceRight() の 2 つ目の引数であるinitialValue として10 を使用します。

js
[0, 1, 2, 3, 4].reduceRight(  (accumulator, currentValue, index, array) => accumulator + currentValue,  10,);
accumulatorcurrentValueindexReturn value
First call104414
Second call143317
Third call172219
Fourth call191120
Fifth call200020

reduceRight から返される値はこのときのもので、もちろん20 です。

配列内のすべての値を合計する

js
const sum = [0, 1, 2, 3].reduceRight((a, b) => a + b);// sum is 6

一連のコールバックを使用して非同期関数のリストを実行し、それぞれの結果を次のコールバックに渡す

js
const waterfall =  (...functions) =>  (callback, ...args) =>    functions.reduceRight(      (composition, fn) =>        (...results) =>          fn(composition, ...results),      callback,    )(...args);const randInt = (max) => Math.floor(Math.random() * max);const add5 = (callback, x) => {  setTimeout(callback, randInt(1000), x + 5);};const mult3 = (callback, x) => {  setTimeout(callback, randInt(1000), x * 3);};const sub2 = (callback, x) => {  setTimeout(callback, randInt(1000), x - 2);};const split = (callback, x) => {  setTimeout(callback, randInt(1000), x, x);};const add = (callback, x, y) => {  setTimeout(callback, randInt(1000), x + y);};const div4 = (callback, x) => {  setTimeout(callback, randInt(1000), x / 4);};const computation = waterfall(add5, mult3, sub2, split, add, div4);computation(console.log, 5); // -> 14// same as:const computation2 = (input, callback) => {  const f6 = (x) => div4(callback, x);  const f5 = (x, y) => add(f6, x, y);  const f4 = (x) => split(f5, x);  const f3 = (x) => sub2(f4, x);  const f2 = (x) => mult3(f3, x);  add5(f2, input);};

reduce と reduceRight の違い

js
const a = ["1", "2", "3", "4", "5"];const left = a.reduce((prev, cur) => prev + cur);const right = a.reduceRight((prev, cur) => prev + cur);console.log(left); // "12345"console.log(right); // "54321"

合成可能な関数の定義

関数合成とは、各関数の出力を次の関数に渡し、最後の関数の出力を最終的な結果とする、関数を組み合わせるための仕組みです。この例ではreduceRight() を使って、関数合成を実現しています。

Wikipedia のFunction composition も参照してください。

js
const compose =  (...args) =>  (value) =>    args.reduceRight((acc, fn) => fn(acc), value);// 渡された数値をインクリメントするconst inc = (n) => n + 1;// 渡された数値を 2 倍にするconst double = (n) => n * 2;// 合成関数を使用するconsole.log(compose(double, inc)(2)); // 6// 合成関数を使用するconsole.log(compose(inc, double)(2)); // 5

reduceRight() を疎配列で使用

reduceRight() は疎配列の欠落している要素をスキップしますが、値がundefined の場合はスキップしません。

js
console.log([1, 2, , 4].reduceRight((a, b) => a + b)); // 7console.log([1, 2, undefined, 4].reduceRight((a, b) => a + b)); // NaN

配列以外のオブジェクトに対する reduceRight() の呼び出し

reduceRight() メソッドはthislength プロパティを読み込み、次にキーがlength より小さい非負の整数である各プロパティにアクセスします。

js
const arrayLike = {  length: 3,  0: 2,  1: 3,  2: 4,  3: 99, // length が 3 であるため reduceRight() からは無視される};console.log(Array.prototype.reduceRight.call(arrayLike, (x, y) => x - y));// -1 すなわち 4 - 3 - 2

仕様書

Specification
ECMAScript® 2026 Language Specification
# sec-array.prototype.reduceright

ブラウザーの互換性

関連情報

Help improve MDN

Learn how to contribute.

This page was last modified on byMDN contributors.


[8]ページ先頭

©2009-2025 Movatter.jp