프로그래밍 「 자바스크립트 편」JavaScript에서 find() 및 filter()의 기능 공개

JavaScript는 배열 내에서 요소의 검색 및 필터링을 단순화하는 강력한 배열 메서드를 제공합니다. 이 기사에서는 두 가지 필수 배열 방법과 그 기능을 살펴보고 유사점과 차이점에 대해 논의합니다. 실제 적용을 보여주는 코드 예제를 제공하여 특정 요소를 효과적으로 검색하거나 주어진 조건에 따라 필터링된 배열을 만들 수 있도록 합니다. 배열 탐색의 세계를 탐구하고 이러한 방법의 잠재력을 활용해 보겠습니다.find()filter()

님이 촬영 한 사진 스티븐 크라크모 on Unsplash

방법:find()

이 메서드는 지정된 테스트 함수를 만족하는 배열의 첫 번째 요소를 반환합니다. 일치 항목이 발견되는 즉시 반복을 중지하고 일치하는 요소가 반환됩니다.find()

기능 :find()

이 방법을 사용하면 제공된 조건에 따라 배열 내의 특정 요소를 검색할 수 있습니다. 배열을 반복하여 일치 항목이 발견될 때까지 각 요소에 테스트 함수를 적용합니다.find()

코드 예: 다음 코드 조각에서는 메서드를 사용하여 배열의 첫 번째 짝수를 검색합니다.find()

const numbers = [1, 3, 4, 7, 8];
const evenNumber = numbers.find((element) => element % 2 === 0);
console.log(evenNumber); // Output: 4

방법:filter()

이 메서드는 지정된 테스트 함수를 통과하는 모든 요소를 포함하는 새 배열을 만듭니다. 일치하는 요소가 있는 배열을 반환합니다.filter()

기능 :filter()

이 방법을 사용하면 지정된 조건에 따라 원래 배열에서 요소를 필터링하여 새 배열을 만들 수 있습니다. 배열을 반복하여 각 요소에 테스트 함수를 적용하고 일치하는 요소를 새 배열에 수집합니다.filter()

코드 예: 이 코드 조각에서는 메서드를 사용하여 원래 배열의 모든 짝수로 새 배열을 만듭니다.filter()

const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter((element) => element % 2 === 0);
console.log(evenNumbers); // Output: [2, 4, 6]

와 유사점 :find()filter()

• 두 메서드 모두 배열에서 작동하며 테스트 함수를 인수로 받아들입니다.
• 배열의 각 요소를 반복하여 테스트 기능을 적용하여 요소를 평가합니다.
• 두 메서드 모두 일치하는 요소(단일 요소() 또는 새 요소 배열())를 기반으로 값을 반환합니다.find()filter()

와 의 차이점 :find()filter()

• find() 반복 중에 발견된 첫 번째 일치하는 요소를 반환하고, 일치하는 모든 요소를 포함하는 배열을 반환합니다.filter()
• find() 일치 항목이 발견되자마자 반복을 중지하는 반면, 전체 배열을 반복하여 일치하는 모든 요소를 수집합니다.filter()
• 의 결과는 단일 요소이거나 일치하는 항목이 없는 경우 의 결과는 항상 배열이며 비어 있을 수 있습니다.find()undefinedfilter()

사용 시기 :find()

• 특정 조건과 일치하는 첫 번째 요소를 찾으려는 경우에 사용합니다.find()
• 주어진 기준을 만족하는 배열에서 단일 요소를 찾아야 할 때 유용합니다.

사용 시기 :filter()

• 지정된 조건을 만족하는 모든 요소를 포함하는 새 배열을 만들어야 할 때 사용합니다.filter()
• 배열에서 일치하는 여러 요소를 추출하는 데 편리합니다.

결론:

JavaScript에서는 요소 검색 및 필터링을 단순화하는 강력한 배열 메서드입니다. 첫 번째 일치하는 요소를 찾는 데 도움이 되지만 지정된 조건을 전달하는 모든 요소를 포함하는 새 배열을 만듭니다. 해당 기능과 차이점을 이해하면 특정 요소를 효과적으로 검색하거나 요구 사항에 따라 필터링된 배열을 만들 수 있습니다. 단일 요소가 필요하든 여러 요소가 필요하든 작업의 특성을 고려하여 사용 사례에 가장 적합한 방법을 선택합니다. JavaScript에서 배열 탐색 및 조작을 최적화하는 기능을 활용합니다.find()filter()find()filter()find()filter()

 

위의 기사가 더 나은 이해를 제공하기를 바랍니다. 이 기사에서 논의한 영역에 대해 질문이 있는 경우 주저하지 말고 아래에 의견을 말하십시오.