JavaScript에서 두 배열의 교차점에서 배열을 만드는 방법은 무엇입니까?

WBOY
풀어 주다: 2023-09-11 17:05:02
앞으로
854명이 탐색했습니다.

如何在 JavaScript 中使用两个数组的交集创建数组?

JavaScript에서 두 배열의 교차는 Set, 스프레드 연산자, filter() 메서드 또는 include() 메서드를 사용하는 등 다양한 방법으로 수행할 수 있습니다. 각 방법에는 고유한 장점과 단점이 있으므로 주어진 작업에 어떤 방법이 가장 적합한지 고려하는 것이 중요합니다. 두 배열의 교차점은 두 배열에서 발견된 요소만 포함하는 새 배열을 생성하려는 경우 유용할 수 있습니다.

예를 들어보자 -

으아악

위에서 우리는 두 개의 배열에 존재하는 동일한 값 중 일부를 포함하여 두 개의 배열 arr1 및 arr2를 정의했습니다. 두 배열의 교차점은 antersecArr입니다.

JavaScript에서 두 배열의 교차점에서 배열을 만드는 방법을 논의해 보겠습니다.

방법 1: filter() 및 include() 메서드 사용

filter() 및 include() 메서드를 사용하여 두 배열에서 교차를 수행할 수 있습니다. filter() 메서드는 함수를 인수로 받아들이고 이를 배열의 각 요소에 적용합니다. 함수는 요소가 새 배열에 포함되어야 하는지 여부를 나타내는 true 또는 false의 부울 값을 반환해야 합니다. 우리의 경우 요소가 두 입력 배열 모두에 존재하기를 원하므로 include() 메서드를 사용하여 요소가 다른 배열에 있는지 확인합니다.

문법

다음은 filter() 및 include() 메서드를 사용하여 두 배열의 교차점에서 새 배열을 생성하는 구문입니다. -

으아악

filter() 메서드는 콜백 함수를 매개변수로 받아들입니다. 이 콜백 함수는 첫 번째 배열(arr1)의 각 요소에 적용되며, include() 메서드를 사용하여 현재 요소(x)가 두 번째 배열(arr2)에 있는지 확인합니다. 현재 요소(x)가 두 번째 배열(arr2)에 있으면 새 배열(교차)에 포함됩니다.

현재 요소(x)가 두 번째 배열(arr2)에 없으면 새 배열(교차점)에서 제외합니다. 최종 결과는 arr1 및 arr2에 있는 요소만 포함하는 새로운 배열(교차점)입니다.

아래 예에서는 각각 5개의 요소를 포함하고 그 중 3개가 동일한 두 개의 배열 arr1 및 arr2를 만듭니다. 그런 다음 필터 및 포함 메소드를 사용하여 두 배열에서 공통 요소의 새 배열을 만듭니다.

으아악

위 코드는 두 입력 배열 모두에 존재하는 요소만 포함하는 새로운 배열인 IntersectionArray를 생성합니다.

방법 2

이 방법에서는 먼저 arr1의 요소에서 새 컬렉션 개체를 만듭니다. 중복된 요소를 제거합니다. 그런 다음 스프레드 연산자를 사용하여 컬렉션 개체를 배열로 변환합니다. 배열에 중복된 요소가 없습니다. 이제 교차를 수행하기 위해 filter() 및 include() 메서드를 사용합니다. 이후 과정은 첫 번째 방법과 동일하다.

으아악

위 구문은 새로운 배열 "교차점"을 생성합니다. arr1에서 모든 중복 항목을 제거한 후 arr1 및 arr2에 있는 요소가 포함됩니다.

으아악

방법 3: Set 사용

이 방법에서는 먼저 새로운 Set() 생성자를 사용하여 배열을 집합으로 변환합니다. 그런 다음 for...of 루프를 사용하여 두 번째 세트의 요소를 반복합니다. 그런 다음 has() 메서드를 사용하여 해당 요소가 첫 번째 Set에 있는지 확인합니다. 요소가 첫 번째 Set에 존재하는 경우 push() 메서드를 사용하여 요소를 교차 배열에 추가합니다.

으아악

이 튜토리얼에서는 예제를 통해 두 배열의 교차점을 사용하여 배열을 만드는 세 가지 방법을 논의했습니다. 첫 번째 방법에서는 filter() 및 include() 메서드를 사용하고, 두 번째 방법에서는 필터 및 포함 외에 스프레드 연산자와 Set도 사용합니다. 세 번째 접근 방식에서는 이 작업을 수행하기 위한 사용자 지정 함수를 만듭니다.

위 내용은 JavaScript에서 두 배열의 교차점에서 배열을 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:tutorialspoint.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!