Array.prototype.reduce()

reduce() 메서드는 누산기(accumulator) 및 배열의 각 값(좌에서 우로)에 대해 (누산된) 한 값으로 줄도록 함수를 적용합니다.

구문

arr.reduce(callback[, initialValue])

매개변수

callback

배열의 각 (요소) 값에 실행할 함수, 인수(argument) 4개를 취하는:

previousValue

이전 마지막 콜백 호출에서 반환된 값 또는 공급된 경우 initialValue. (아래 참조.)

currentValue

배열 내 현재 처리되고 있는 요소(element).

currentIndex

배열 내 현재 처리되고 있는 요소의 인덱스.

array

reduce에 호출되는 배열.

initialValue

선택사항. callback의 첫 호출에 첫 번째 인수로 사용하는 값.

설명

reduce는 배열에 있는 구멍(빈 값)은 제외한 각 요소에 대해 callback 함수를 한 번 실행합니다, 다음 네 인수를 취하는:

• previousValue
• currentValue
• currentIndex
• array

콜백이 호출된 첫 번째는, previousValue 및 currentValue 두 값 중 하나일 수 있습니다. reduce 호출에 initialValue가 제공된 경우, 그러면 previousValue는 initialValue와 같고 currentValue는 배열의 첫 번째 값과 같을 겁니다. initialValue가 제공되지 않은 경우, 그러면 previousValue는 배열의 첫 번째 값과 같고 currentValue는 두 번째와 같을 겁니다.

빈 배열에 initialValue가 제공되지 않은 경우, TypeError가 발생됩니다. 배열이 요소가 하나(위치와 관계없이)뿐이고 initialValue가 제공되지 않은 경우 또는 initialValue는 제공됐으나 배열이 빈 경우, 그 단독 값이 callback 호출 없이 반환됩니다.

다음과 같은 reduce 사용이 일어났다고 생각해 보세요:

[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, currentIndex, array) {
  return previousValue + currentValue;
});

콜백은 4번 호출됩니다, 다음과 같이 되는 각 호출의 인수 및 반환값과 함께:

reduce에 의해 반환되는 값은 마지막 콜백 호출의 반환값 (10)이 됩니다.

완전한 함수 대신에 화살표 함수를 제공할 수도 있습니다. 아래 코드는 위 블록 내 코드와 같은 출력을 냅니다:

[0, 1, 2, 3, 4].reduce( (prev, curr) => prev + curr );

reduce의 두 번째 인수로 초기값을 제공하는 경우, 결과는 다음과 같을 겁니다:

[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, currentIndex, array) {
  return previousValue + currentValue;
}, 10);

최종 호출 반환값(20)은 reduce 함수의 결과로서 반환됩니다.

예

배열의 값 모두 더하기

var total = [0, 1, 2, 3].reduce(function(a, b) {
  return a + b;
});
// total == 6

배열의 배열(2차원 배열) 1차원으로 내리기

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
  return a.concat(b);
}, []);
// flattened is [0, 1, 2, 3, 4, 5]

폴리필

Array.prototype.reduce는 ECMA-262 표준 제5판에 추가되었습니다; 그러하기에 표준의 모든 구현에 없을 수 있습니다. 스크립트 시작 부분에 다음 코드를 삽입하여 이를 우회할 수 있습니다, 원래 지원하지 않는 구현에서 reduce를 사용케 하는.

// ECMA-262 5판, 15.4.4.21항의 작성 과정
// 참고: https://es5.github.io/#x15.4.4.21
if (!Array.prototype.reduce) {
  Array.prototype.reduce = function(callback /*, initialValue*/) {
    'use strict';
    if (this == null) {
      throw new TypeError('Array.prototype.reduce called on null or undefined');
    }
    if (typeof callback !== 'function') {
      throw new TypeError(callback + ' is not a function');
    }
    var t = Object(this), len = t.length >>> 0, k = 0, value;
    if (arguments.length == 2) {
      value = arguments[1];
    } else {
      while (k < len && !(k in t)) {
        k++;
      }
      if (k >= len) {
        throw new TypeError('Reduce of empty array with no initial value');
      }
      value = t[k++];
    }
    for (; k < len; k++) {
      if (k in t) {
        value = callback(value, t[k], k, t);
      }
    }
    return value;
  };
}

스펙

브라우저 호환성

참조

• Array.prototype.reduceRight()