배열 메서드 이해하기: map, filter, reduce, find, forEach

자바스크립트의 배열은 단순 데이터 모음 그 이상입니다. 실전 프로젝트에서 데이터를 분석하고 변환할 때, 배열 메서드들을 적재적소에 활용하는 것이 중요한 역량입니다.

map은 배열 요소 각각에 변환 함수를 적용해 새로운 배열을 만듭니다. 예를 들어, 숫자 배열의 모든 값을 두 배로 바꾸고 싶다면 map이 제격입니다.

const numbers = [1, 2, 3];
const doubled = numbers.map(n => n * 2); // [2, 4, 6]

filter는 조건을 만족하는 값만 걸러서 새로운 배열을 반환합니다. 데이터에서 특정 조건을 충족하는 항목만 선별할 때 유용합니다.

const even = numbers.filter(n => n % 2 === 0); // [2]

reduce는 배열의 모든 값을 누적하여 단일 값으로 만듭니다. 합계, 평균, 최대값 찾기 등 집계 연산에 자주 쓰입니다.

const sum = numbers.reduce((acc, cur) => acc + cur, 0); // 6

find는 주어진 조건을 만족하는 첫 번째 값을 찾습니다. 찾으려는 데이터가 하나라면 find가 유리합니다.

const firstEven = numbers.find(n => n % 2 === 0); // 2

forEach는 각 요소에 대해 반복 작업을 수행하되, 결과를 반환하지 않습니다. 데이터를 탐색하며 부수 효과(side effect)를 줄 때 사용합니다.

numbers.forEach(n => console.log(n)); // 1 2 3

객체 메서드 활용: Object.keys, Object.values, Object.entries

객체의 속성을 다룰 때는 배열과 달리 전용 메서드가 필요합니다. Object.keys는 속성 이름만 모아 배열로 반환하고, Object.values는 값만 추출합니다. Object.entries는 [키, 값] 형태의 배열을 반환해 객체 반복에 최적화된 형태를 제공합니다.

const user = { name: '태희', age: 30 };
Object.keys(user); // ["name", "age"]
Object.values(user); // ["태희", 30]
Object.entries(user); // [["name", "태희"], ["age", 30]]

이 세 가지 메서드는 객체 데이터를 배열처럼 가공하는 데 강력한 도구가 됩니다. 예를 들어, Object.entries와 map을 조합하면 객체의 내용을 쉽게 변경할 수 있습니다.

메서드 선택의 기준과 실전 조언

이처럼 배열과 객체 각각에 특화된 메서드들이 준비되어 있습니다. 데이터 변환에는 map, 선택에는 filter, 집계에는 reduce, 특정 값 검색은 find, 반복 작업에는 forEach를 선택하세요. 객체 데이터에 대한 일괄 처리, 변환이 필요할 때는 Object.keys, Object.values, Object.entries가 답이 됩니다.

중급 개발자는 이들 메서드의 동작 특성과 반환 결과를 이해하고, 상황에 맞게 조합하는 능력을 키워야 합니다. 메서드를 적절히 활용하면 반복문보다 깔끔하고 에러 없는 코드를 만들 수 있습니다. 나아가, 실무에서는 이러한 메서드들을 응용해 데이터를 자유자재로 다루는 연습이 필수입니다.