find()
- find() 함수는 주어진 콜백 함수의 조건을 만족하는 배열의 첫 번째 원소만 반환한다.
- 만약 조건을 만족하는 원소가 없으면 undefined를 반환한다.
- find() 함수는 단일 값을 찾을 때 사용한다.
const numbers = [1, 2, 3, 4, 5];
const evenNumber = numbers.find(num => num % 2 === 0);
console.log(evenNumber); // 출력: 2
filter()
- filter() 함수는 주어진 콜백 함수의 조건을 만족하는 모든 배열 원소를 포함한 새로운 배열을 반환한다.
- 만약 조건을 만족하는 원소가 없으면 빈 배열을 반환한다.
- filter() 함수는 여러 값을 찾거나, 조건에 맞는 모든 원소를 추출하고자 할 때 사용한다.
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // 출력: [2, 4]
요약
- 각 메소드는 내부적으로 반복문을 사용하지만,
- find()는 조건을 만족하는 원소를 찾으면 반복을 중지하고 해당 원소를 반환한다.
- filter()는 조건에 만족하는 모든 원소를 찾기 때문에 배열 전체를 순회한다.
- find()와 filter() 모두 리액트에서도 자주 사용하지만, 순수 JavaScript의 배열 메소드이다.