find와 filter는 둘 다 배열에서 특정 조건을 만족하는 요소를 찾기위한 메서드이다.
하지만 목적과 반환하는 값에서 차이가 있다!
배열에서 조건을 만족하는 첫번째 요소를 찾는다.
const numbers = [1, 2, 3, 4, 5];
// 3보다 큰 첫 번째 숫자를 찾습니다.
const found = numbers.find(num => num > 3);
console.log(found); // 출력: 4
위 예시를 보면 numbers라는 배열에서 조건에 만족하는 요소를 찾기위해
found라는 변수를 선언하였고, find 메서드를 사용하였다.
find의 인자로는 콜백함수가 오며 해당 함수는 3보다 큰 숫자를 찾는 함수이다.
found에는 numbers의 요소중 3보다 큰 첫번째 요소인 4가 담겼다.
배열에서 조건을 만족하는 모든 요소를 찾는다.
const numbers = [1, 2, 3, 4, 5];
// 3보다 큰 모든 숫자를 찾습니다.
const filtered = numbers.filter(num => num > 3);
console.log(filtered); // 출력: [4, 5]
위 예시를 보면 numbers라는 배열에서 조건에 만족하는 요소를 찾기위해
filtered라는 변수를 선언하였고, filter 메서드를 사용하였다.
filter의 인자로는 콜백함수가 오며 해당 함수는 3보다 큰 숫자를 찾는 함수이다.
단, find 메서드와는 다르게 해당 조건에 충족하는 모든 요소를 찾아
filtered에 4,5가 담겼다.
정리하자면, find는 인자로 들어오는 콜백함수의 조건에 만족하는 하나의 요소를 반환하고
filter는 조건을 만족하는 모든 요소를 배열로 반환하고 있다.
find 메서드는 만족하는 요소가 없을 경우 undefined를 출력하고
filter메서드는 빈 배열([])을 출력한다