[JS] reduce()

KJA·2022년 8월 3일
0

reduce()

syntax

배열의 각 요소를 순회하며 callback함수의 실행 값을 누적하여 하나의 결과값을 반환 합니다.

배열.reduce((누적값, 현재요소값, 인덱스, 현재배열) => { return 결과 }, 초깃값);

arr.reduce(callback[, initialValue]);

parameter

  1. callback function
    다음 4가지의 인수를 가집니다.
  • 누적값(accumulator) : callback 함수의 반환 값을 누적합니다.
  • 현재요소값(currentValue) : 배열의 현재 요소
  • 인덱스(index) (optional) : 배열의 현재 요소의 인덱스
  • 현재배열(array) (optional) : 호출한 배열

callback 함수의 반환 값은 accumulator에 할당 되고 순회 중 계속 누적되어 최종적으로 하나의 값을 반환합니다.

  1. initalValue(optional)
  • 최초 callback 함수 실행 시 accumulator 인수에 제공되는 값
  • 초기값을 제공하지 않을 경우 배열의 첫 번째 요소를 사용하고, 빈 배열에서 초기값이 없을 경우 에러가 발생합니다.

초기값을 안 넣었을 경우

[1, 2, 3, 4].reduce((a, c) => a + c, 0); // 10
// a: 1 c: 2
// a: 3 c: 3
// a: 6 c: 4
// 10 (마지막 최종 누적 값이 리턴 값)

reduce()를 볼 땐 초기 값을 잘 봐야합니다.

더하기

[1, 2, 3, 4].reduce((a, c) => a + c, 0); // 10
// a: 0 c: 1
// a: 1 c: 2
// a: 3 c: 3
// a: 6 c: 4
// 10 (마지막 최종 누적 값이 리턴 값)

곱하기

[1, 2, 3, 4].reduce((a, c) => a * c, 1); // 24
// a: 1 c: 1
// a: 1 c: 2
// a: 2 c: 3
// a: 6 c: 4
// 24

평균

[1, 2, 3, 4].reduce((a, c) => a + c, 0) / [1, 2, 3, 4].length; // 2.5

배열을 객체로

['짱구', '철수', '훈이', '맹구'].reduce((a, c, i) => { a[i] = c; return a; }, {});
// {0: '짱구', 1: '철수', 2: '훈이', 3: '맹구'}

// 분석
// a: {} / c: '짱구' / i: 0
// a: {0: '짱구'}, / c: '철수' / i: 1
// a: {0: '짱구', 1: '철수'} / c: '훈이' / i: 2
// a: {0: '짱구', 1: '철수', 2: '훈이'} / c: '맹구' / i: 2
// {0: '짱구', 1: '철수', 2: '훈이', 3: '맹구'}

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

0개의 댓글