reduce

reduce() 메서드는 배열의 요소들을 순회하면서 반복적인 연산을 하는 메서드이다.

공식문서의 내용이 처음에 봤을 때 눈에 들어오지 않기 때문에 예시 코드를 들어가며 이해해보자.

const array = [3, -1, 10, 5, 0];

const sum = array.reduce(function(accumulator, currentValue) {
return accumulator + currentValue;
)};

arrow function사용 version

const array = [3, -1, 10, 5, 0];

const sum = array.reduce((accumulator, currentValue) =>accumulator + currentValue);

또 다른 예시 Object에서 reduce 사용하기

var array = [
{name: "james", age: 20},
{name: "tom", age: 65},
{name: "terry", age: 35},
{name: "jonathan", age: 18},
];

var sum = array.reduce((accumulator, currentValue) =>accumulator + currentValue.age);
//이렇게 끝나면 우리가 원하는 숫자가 나오지 않는다. 그럼 어떻게?

var sum = array.reduce((accumulator, currentValue) =>accumulator + currentValue.age, 0);
//이렇게 initialValue인 초기값을 마지막에 넣어줘야 우리가 원하는 숫자가 나온다.

이렇게 하면 array 배열에 들어있는 애들의 총 합이 구해진다.
근데 저 어렵게 생긴 accumulator와 currentValue는 뭘까?

영어의 뜻을 풀어보자면 accumulator는 축압기, currentValue는 현재 값을 의미한다.

이걸 만든 사람이 그냥 이름을 막 짓지 않았을 것이기 때문에 이름을 해석해보면 감이 잡히는 경우가 있다. 그리고 뜻과 용도를 연결지어 외울 수도 있다. 그래서 나는 모르는 영어가 있으면 한국어로 해석해본다.

근데 accumulator는 축압기는 어떤 관련이 있는건데?

아! 누산기 라고 부르는게 accumulator인가 보다! 누산기는 콜백의 반환값을 누적한다고 한다.

---

콜백의 최초 호출 때 accumulator와 currentValue는 두 가지 값 중 하나를 가질 수 있다고 한다.
만약 1. reduce() 함수 호출에서 initialValue를 제공한 경우.
accumulator === initialValue , currentValue === 배열의 첫 번째 값.

만약 2. initialValue 제공X.
accumulator === 배열의 첫 번째 값, currentValue === 배열의 두 번째 값.

그런데 initialValue가 어떤걸 가리키는거지?

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

이런 코드가 있다고치면 0이 이니셜밸류인거다.

initialValue (Optional)
callback의 최초 호출에서 첫 번째 인수에 제공하는 값. 초기값을 제공하지 않으면 배열의 첫 번째 요소를 사용한다. 빈 배열에서 초기값 없이 reduce()를 호출하면 오류가 발생한다.

위 표를 보면 원리가 이해가 간다.

으아 일단 optional이라고 되어 있는 아이들은 잠시 옆으로 치워놓고 accumulator와 currentValue만이라도 알고 있어야겠다.