JavaScript | map과 filter의 차이점

기술면접 때 배열 메소드 중 map과 filter의 차이점을 질문받아 전혀 대답하지 못하고 나왔다.

map

map() 함수는 배열의 각 요소에 대해 지정된 함수를 호출하고, 반환된 값을 사용하여 새로운 배열을 생성한다.
따라서 map() 함수를 사용하면 기존 배열과 길이가 같은 새로운 배열을 생성하며, 이 새로운 배열의 각 요소는 기존 배열의 각 요소를 변환한 값이 된다.

const arr = [1, 2, 3, 4];
const mappedArr = arr.map(item => item * 2);
console.log(mappedArr); // [2, 4, 6, 8]

filter

filter() 함수는 배열에서 특정 조건을 충족하는 요소만 추출하여 새로운 배열을 생성한다.
따라서 filter() 함수를 사용하면 새로운 배열의 길이는 기존 배열의 길이보다 작거나 같을 수 있다.

const arr = [1, 2, 3, 4];
const filteredArr = arr.filter(item => item % 2 === 0);
console.log(filteredArr); // [2, 4]

정리

• map() 함수는 기존 배열의 각 요소를 변환하여 새로운 배열을 생성한다.
• filter() 함수는 기존 배열에서 특정 조건을 충족하는 요소만 추출하여 새로운 배열을 생성한다.