reduce() 함수
reduce() 함수는 배열의 각 요소를 순회하며, callback 함수의 실행 값을 누적하여 하나의 결과값을 반환한다.
arr.reduce(callback[, initialValue]);
JavaScript
복사
파라미터
accumulator
•
accumulator는 callback 함수의 반환값을 누적한다
currentValue
•
배열의 현재 요소
index (optional)
•
배열의 현재 요소의 인덱스
array (optional)
•
호출한 배열
→ callback 함수의 반환값은 accumulator에 할당되고, 순회 중 계속 누적되어 최종적으로 하나의 값을 반환한다
initialValue (optional)
•
최초 callback 함수 실행 시, accumulator 인수에 제공되는 값
•
초기값을 제공하지 않을 경우, 배열의 첫 번째 요소를 사용하고, 빈 배열에서 초기값이 없을 경우 에러가 발생한다
return 값
•
배열을 순서대로 불러 각 요소에 대해 callback 함수를 실행한 결과를 누적한 값
ex)
배열의 모든 값 (1 ~ 10) 더하기
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const sum = numbers.reduce((accumulator, currentnumber) => accumulator + currentNumber);
console.log('sum = ', sum);
JavaScript
복사
or
function sumReducer(accumulator, currentNumber) {
return accumulator + currentNumber;
}
cosnt sum = numbers.reduce(sumReducer);
console.log('sum = ', sum);
JavaScript
복사
오브젝트 배열에서 원하는 항목의 값만 더하기
const friends = [
{
name: '양주진',
age: 32,
job: '코인러',
married: false,
},
{
name: '오영제',
age: 32,
job: '랩퍼',
married: false,
},
{
name: '서준형',
age: 35,
job: '2년차 유부남',
married: true,
}
];
// 3명의 나이를 더해본다
// 여기서 초기값 설정이 반드시 필요
const ageSum = friends.reduce((accumulator, currentObject) => {
return accumulator + currentObject.age;
}, 0);
console.log('친구들 나이 합 ', ageSum);
JavaScript
복사
ex2)
[1, 2, 3, 4].reduce((a, c) => (a + c))
// a : 누적값
// c : 현재값
// output : 10
[1, 2, 3, 4].reduce((a, c) => (a + c), 0)
// 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)
// a: 1, c: 1
// a: 1, c: 2
// a: 2, c: 3
// a: 6, c: 4
// 24
['ash', 'island', 'james', 'john'].reduce((a, e, i) => { a[i] = c, return a }, {})
// 배열을 객체로 바꿀수도 있고, 객체 리터럴로 변환 가능
// {0: "ash", 1: "island", 2: "james", 3: "john"}
// a: {}, c: 'ash', i: 0
// a: {0: 'ash'}, c: 'island', i: 1
// a: {0: 'ash', 1: 'island'}, c: 'james', i: 2
// a: {0: 'ash', 1: 'island', 2: 'james'}, c: 'john', i: 3
// a: {0: 'ash', 1: 'island', 2: 'james', 3: 'john'}
JavaScript
복사
배열을 조작할 때 가장 강력한 reduce() 함수
초기값을 안 넣는 경우는? 첫번째 값이 초기값이다
[1, 2, 3, 4].reduce((a, c) => (a + c));
// a: 1, c: 2
// a: 3, c: 3,
// a: 6, c: 4,
// 10
JavaScript
복사
ex)
[1, 2, 3, 4, 5].reduce((a, c) => {
a[c] = c * 10;
return a; // 꼭 리턴 넣기 -> a가 undefined가 되는 불상사
}, {});
// {1: 10, 2: 20, 3: 30, 4: 40, 5: 50}
JavaScript
복사
