배열 고차 함수 (map, filter, reduce)
함수를 인자로 받는 고차 함수(Higher-Order Function)는 모던 자바스크립트의 꽃입니다. React에서 리스트를 렌더링하거나 데이터를 가공할 때 map과 filter는 필수불가결합니다.
const users = [
{ id: 1, name: "Alice", age: 25 },
{ id: 2, name: "Bob", age: 30 },
{ id: 3, name: "Charlie", age: 35 }
];
// 1. map(): 배열의 각 요소를 변환하여 새로운 배열 생성
const names = users.map(user => user.name);
console.log(names); // ["Alice", "Bob", "Charlie"]
// 2. filter(): 조건에 맞는 요소만 걸러내어 새로운 배열 생성
const over30 = users.filter(user => user.age >= 30);
console.log(over30); // Bob, Charlie 객체 배열
// 3. reduce(): 배열의 모든 요소를 하나의 값으로 누적 (예: 나이 총합)
const totalAge = users.reduce((sum, user) => sum + user.age, 0);
console.log("총 나이:", totalAge); // 90
// 4. find(): 조건에 맞는 첫 번째 요소를 반환
const bob = users.find(user => user.name === "Bob");
console.log(bob.age); // 30