reduce() 함수
reduce()는 JavaScript에서 배열을 하나의 값으로 축소하거나 누적하는 데 사용되는 메서드입니다. 배열의 각 요소를 순차적으로 처리하면서 누적된 값을 반환합니다. 배열의 항목을 반복하면서 각 항목을 결합하거나 변형할 수 있는 매우 유용한 메서드입니다.
reduce()는 배열을 단일 값으로 집계하거나 복합적인 작업을 할 때 강력하게 사용됩니다.
기본문법
array.reduce((accumulator, currentValue, currentIndex, array) => {
// 반환할 값은 accumulator
}, initialValue);
accumulator : 누적된 값. 이전 반복에서 반환된 값이 여기에 들어옵니다.
currentValue : 현재 배열의 값
currentIndex : 현재 항목의 인덱스 (선택적)
array : reduce() 가 호출된 배열 (선택적)
initialValue : 첫번째 반복에서 사용되는 초기값. 이 값을 제공하지 않으면 배열의 첫 번째 요소가 기본값으로 사용됩니다.
기본 사용 예제
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 10
작동방식
예제1) 배열의 합 구하기
reduce()는 배열을 한 번 순회하면서, 누적값을 반환합니다. 이때 초기값을 설정하면 첫 번째 항목부터 시작하고, 초기값을 설정하지 않으면 배열의 첫번째 항목을 초기값으로 사용합니다.
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum); // 15
배열을 순회하면서 각 항목을 acc 에 더하여 합을 계산합니다.
예제2) 배열을 객체로 변환하기
배열의 항목을 키-값 쌍으로 변환하려면 reduce()를 사용할 수 있습니다.
const people = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 30 },
{ name: 'Charlie', age: 35 }
];
const peopleObject = people.reduce((acc, person) => {
acc[person.name] = person.age; // name을 키로 하고, age를 값으로 저장
return acc;
}, {}); // 초기값은 빈 객체 {}
console.log(peopleObject);
// { Alice: 25, Bob: 30, Charlie: 35 }
배열 내 객체의 속성 중 하나를 키로, 나머지 속성을 값으로 사용하는 방식입니다.
'웹 개발 > 🌐 JavaScript' 카테고리의 다른 글
JavaScript 디스트럭처링 + 변수 이름 바꾸기 한 방에 이해하기 (1) | 2025.06.19 |
---|---|
Three.js | nginx 사용시 (0) | 2025.06.18 |
Nullish Coalescing Operator (??) (0) | 2025.04.28 |
Optional Chaining (?.) 문법 (0) | 2025.04.28 |
flatMap()함수 (0) | 2025.04.28 |
reduce() 함수
reduce()는 JavaScript에서 배열을 하나의 값으로 축소하거나 누적하는 데 사용되는 메서드입니다. 배열의 각 요소를 순차적으로 처리하면서 누적된 값을 반환합니다. 배열의 항목을 반복하면서 각 항목을 결합하거나 변형할 수 있는 매우 유용한 메서드입니다.
reduce()는 배열을 단일 값으로 집계하거나 복합적인 작업을 할 때 강력하게 사용됩니다.
기본문법
array.reduce((accumulator, currentValue, currentIndex, array) => {
// 반환할 값은 accumulator
}, initialValue);
accumulator : 누적된 값. 이전 반복에서 반환된 값이 여기에 들어옵니다.
currentValue : 현재 배열의 값
currentIndex : 현재 항목의 인덱스 (선택적)
array : reduce() 가 호출된 배열 (선택적)
initialValue : 첫번째 반복에서 사용되는 초기값. 이 값을 제공하지 않으면 배열의 첫 번째 요소가 기본값으로 사용됩니다.
기본 사용 예제
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 10
작동방식
예제1) 배열의 합 구하기
reduce()는 배열을 한 번 순회하면서, 누적값을 반환합니다. 이때 초기값을 설정하면 첫 번째 항목부터 시작하고, 초기값을 설정하지 않으면 배열의 첫번째 항목을 초기값으로 사용합니다.
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum); // 15
배열을 순회하면서 각 항목을 acc 에 더하여 합을 계산합니다.
예제2) 배열을 객체로 변환하기
배열의 항목을 키-값 쌍으로 변환하려면 reduce()를 사용할 수 있습니다.
const people = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 30 },
{ name: 'Charlie', age: 35 }
];
const peopleObject = people.reduce((acc, person) => {
acc[person.name] = person.age; // name을 키로 하고, age를 값으로 저장
return acc;
}, {}); // 초기값은 빈 객체 {}
console.log(peopleObject);
// { Alice: 25, Bob: 30, Charlie: 35 }
배열 내 객체의 속성 중 하나를 키로, 나머지 속성을 값으로 사용하는 방식입니다.
'웹 개발 > 🌐 JavaScript' 카테고리의 다른 글
JavaScript 디스트럭처링 + 변수 이름 바꾸기 한 방에 이해하기 (1) | 2025.06.19 |
---|---|
Three.js | nginx 사용시 (0) | 2025.06.18 |
Nullish Coalescing Operator (??) (0) | 2025.04.28 |
Optional Chaining (?.) 문법 (0) | 2025.04.28 |
flatMap()함수 (0) | 2025.04.28 |