[JavaScript] reduce() 함수

간단한 사용 예

---

const num = [10, 20, 30, 40, 50];

const value = num.reduce((a, b) => {
  return a + b;
});

console.log(value); // 150

 

상세 설명 및 예시

---

reduce 함수는 배열의 각 요소에 대해 함수를 실행하고 하나의 결과값을 반환합니다.

arr.reduce(callback[, initialValue])

 

 

callback은 총 네 가지 인수를 사용할 수 있으며 두 가지의 필수 옵션과 두 가지의 선택 옵션이 존재합니다.

인수 이름	설명	필수
accumulator	callback의 반환값을 저장 initalValue를 설정했을 경우 최초 호출 시 intalValue 값을 제공 initalValue를 설정하지 않았을 경우 초기 값은 배열의 첫 번째 요소	✔️
currentValue	처리할 현재 요소 intalValue 값을 제공하는 경우 초기 값은 배열의 첫 번째 요소 intalValue 값을 제공하지 않았을 경우 초기 값은 배열의 두 번째 요소	✔️
currentIndex	처리할 현재 요소의 인덱스	❌
array	reduce()를 호출한 배열	❌

initalValue은 선택 옵션입니다.

인수 이름	설명	필수
initalValue	callback의 최초 호출 시 함수의 첫 번째 인수(accumulator)에 제공하는 값 initalValue를 제공하지 않은 경우 함수의 첫 번째 인수는 배열의 첫 번째 요소를 사용	❌

 

 

initalValue를 설정하지 않은 경우

---

const num = [10, 20, 30, 40, 50];

const value = num.reduce((acc, cur, index, arr) => {
  console.log(acc);
  console.log(cur);
  console.log(index);
  console.log(arr);

  return acc + cur;
});

console.log(value); // 150

순서	acc	cur	index	arr	acc + cur
1	10	20	1	[10, 20, 30, 40, 50]	30
2	30	30	2		60
3	60	40	3		100
4	100	50	4		150

initalValue를 설정한 경우

---

initalValue를 100으로 설정하겠습니다.

const num = [10, 20, 30, 40, 50];

const value = num.reduce((acc, cur, index, arr) => {
  console.log(acc);
  console.log(cur);
  console.log(index);
  console.log(arr);

  return acc + cur;
}, 100);

console.log(value); // 250

 

순서	acc	cur	index	arr	acc + cur
1	100	10	0	[10, 20, 30, 40, 50]	110
2	110	20	1		130
3	130	30	2		160
4	160	40	3		200
5	200	50	4		250