[JavaScript] reduce()

배열의 각 요소에 주어진 리듀서 함수 실행 후 하나의 결과값을 반환

reduce의 인자는 4개

1. 누산기 (acc) : 리듀서 함수의 반환값이 할당됨
2. 현재 값 (cur) : 배열의 [1]번째 인덱스부터 [ 인덱스 +1 ] 에 해당하는 값
3. 현재 인덱스 (idx)
4. 원본 배열 (src)

 

예시

const arr = [1, 2, 3, 4]

const reducedArr = arr.reduce((acc, cur) => acc + cur)

console.log(reducedArr) // 10

• 배열의 모든 값을 더한 결과값을 반환하는 로직
• 위 예시에서 인자는 acc, cur만 사용
• 여기서 주어진 리듀서 함수는 { return  acc + cur }

 

=> console로 확인해보기

const arr = [1, 2, 3, 4]

const reducedArr = arr.reduce((acc, cur, idx, src) => {
        console.log('=================')
        console.log('누산기 : ', acc)
        console.log('현재값 : ', cur)
        console.log('현재 인덱스 : ', idx)
        console.log('원본 배열 : ', src)

        // 화살표 함수에서 중괄호{} 없이 한 줄로 쓰면 return 을 자동으로 해줌
        // 이 경우 중괄호{}를 썼기 때문에 return 을 써줘야 함
        return acc + cur
    }
)

console.log('=================')
console.log('최종 결과값 : ', reducedArr)

누산기를 보면 이전 루프의 누산기(acc) + 현재값(cur)의 결과가 저장되어 있다

* 최초 실행 시에는 누산기(acc) = 0번째 인덱스 값이다