JavaScript에서 다른 배열의 부분 개체를 포함하는 배열을 만드는 방법은 무엇입니까?

WBOY
풀어 주다: 2023-08-29 10:01:02
앞으로
830명이 탐색했습니다.

JavaScript에서 다른 배열의 부분 개체를 포함하는 배열을 만드는 방법은 무엇입니까?

배열은 JavaScript에서 가장 일반적으로 사용되는 데이터 유형 중 하나입니다. 이는 데이터 세트를 저장하고 데이터에 대한 효율적인 액세스 및 조작을 허용하는 데 사용됩니다. 배열에는 기본 값, 객체, 심지어 다른 배열을 포함한 모든 유형의 데이터가 포함될 수 있습니다.

배열에서 부분 객체 배열을 생성하는 기술은 복잡한 데이터 세트로 작업할 때 유용한 기술입니다. 부분 개체에는 원본 배열에 있는 데이터의 하위 집합만 포함되므로 특정 데이터 집합에 집중할 수 있습니다. 이는 필요한 데이터만 처리하기가 더 쉬워지므로 대규모 데이터 세트로 작업할 때 특히 유용합니다.

map() 메서드를 사용하여 JavaScript의 다른 배열에서 부분 개체 배열을 만들 수 있습니다. map() 메소드를 사용하면 배열을 반복하고 새 배열을 생성할 수 있으며, 그 결과 원래 배열의 각 요소에 대해 제공된 함수가 호출됩니다.

문법

JavaScript에서 다른 배열로부터 부분 객체 배열을 생성하는 구문은 다음과 같습니다. -

으아아아

이 구문에서 OriginalArray는 부분 객체가 생성될 객체를 포함하는 원본 배열의 이름입니다. 이 배열에 대해 map 메소드를 호출하고 함수를 인수로 전달합니다. 이 함수는 원본 배열의 각 요소에 대해 호출되며 부분 개체의 새 배열을 만드는 데 사용됩니다.

map 메소드에 전달된 함수는 원본 배열의 단일 요소인 하나의 인수를 사용합니다. 흔히 프로젝트라고 합니다. 이 함수에서는 원본 개체에서 추출하려는 속성만 포함된 개체를 반환할 수 있습니다.

파괴 할당을 사용하여 동일한 결과를 얻을 수도 있습니다.

으아아아

map 메소드는 원래 배열을 수정하지 않고 부분 객체를 포함하는 새 배열을 생성한다는 점에 유의하세요.

부분 객체 배열을 생성하는 방법

map() 메소드 사용

JavaScript에서 map() 함수는 배열에서 호출되어 새 배열을 생성할 수 있는 메서드이며, 그 결과 제공된 함수가 원래 배열의 각 요소에 호출됩니다. 새 배열은 원래 배열과 동일한 수의 요소를 갖지만 각 요소는 map() 메소드에서 제공하는 기능에 따라 변환됩니다.

다음은 map() 메서드를 사용하여 다른 배열에서 부분 개체 배열을 만드는 방법에 대한 예입니다. -

으아아아

위의 예에는 id, name 및 age 속성이 있는 객체가 포함된 기본 배열이 있습니다. 우리는 map 메소드를 사용하여 배열을 반복하고 원래 배열에 있는 각 객체의 id 및 name 속성만 포함하는 새 arraytialObjects를 만듭니다.

구조 분해 사용

이 방법에서는 구조 분해 할당과 나머지 연산자를 사용하여 속성을 추출합니다. 구조 분해 할당은 arrayItems 배열의 각 개체에서 모델 및 ID 속성을 추출하는 반면 나머지 연산자는 나머지 모든 속성을 Rest라는 새 개체로 추출합니다.

으아아아

reduce() 메소드를 사용하세요

reduce() 메서드는 배열을 반복하고 결과를 사용하여 단일 값이나 개체를 만들 수 있는 또 다른 메서드입니다. 이는 여러 개체의 부분 속성을 사용하여 단일 개체를 만들어야 하는 경우 유용합니다.

으아아아

결론

요약하자면, map() 메소드는 JavaScript의 기존 배열에서 새 배열을 생성하기 위한 강력한 도구입니다. 이를 통해 배열을 반복하고, 각 요소에 대해 일부 작업을 수행하고, 결과로 새 배열을 만들 수 있습니다. 이는 객체 배열을 처리할 때 유용하며 각 객체에서 특정 속성만 추출하면 됩니다.

map() 메서드는 원래 배열을 수정하지 않고 새 배열을 생성한다는 점에 유의해야 합니다. 따라서 원본 배열을 수정하려면 forEach() 메서드를 사용하세요.

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

원천:tutorialspoint.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿