JavaScript를 사용하여 일반 객체를 ES6 맵으로 변환하는 방법은 무엇입니까?

JavaScript에서 일반 객체를 ES6 맵으로 변환하는 방법에는 여러 가지가 있습니다. 가장 간단하고 효율적인 방법은 Object.entries() 함수와 Map() 생성자를 사용하는 것입니다. 이와 대조적으로 더 유연한 대안에는 Object.keys() 및 Array.prototype.forEach()는 물론 for...in 루프 및 Map() 함수 메서드가 포함됩니다.

ES6의

Map은 키-값 쌍의 모음입니다. 여기서는 문자열 및 숫자와 같은 기본 데이터 유형을 포함하여 모든 유형의 객체를 키로 사용할 수 있습니다. 맵의 값은 모든 유형의 객체가 될 수 있습니다.

Map과 Object의 주요 차이점은 Map에서는 키가 모든 데이터 유형일 수 있지만 Object에서는 항상 문자열로 변환된다는 것입니다.

그럼에도 불구하고 맵은 반복 가능성 및 요소 순서 보장과 같은 일반 개체에 비해 몇 가지 장점이 있습니다. 이 기사에서는 JavaScript를 사용하여 일반 객체를 ES6 맵으로 변환하는 방법을 설명합니다.

방법 1: Object.entries() 및 Map() 사용

오늘 배울 첫 번째 일반 객체 intp ES6 매핑 변환 방법은 두 단계로 구성됩니다-

• Object.entries() 메서드를 사용하여 객체에서 키-값 쌍의 배열을 가져옵니다

• 그런 다음 해당 배열을 Map() 생성자에 전달합니다.

예

Object.entries() 메서드에서 반환된 배열의 각 배열은 객체의 키-값 쌍을 나타냅니다. 다음은 Object.entries() 및 Map() 생성자를 사용하여 일반 객체를 ES6 맵으로 변경하는 방법에 대한 예입니다. -

으아악

이 예에서는 Object.entries() 함수를 사용하여 일반 객체를 키-값 쌍의 배열로 변환합니다. 그런 다음 이 배열은 이러한 키-값 쌍을 사용하여 새 Map 개체를 생성하는 Map() 함수에 전달됩니다.

Object.entries() 메서드에는 코드 한 줄만 필요하며 대부분의 최신 브라우저에서 완벽하게 지원됩니다. 그러나 이 접근 방식은 열거 가능한 속성이 있는 객체로 제한되며 기호 키가 있는 속성은 제외됩니다.

방법 2: for...in 루프 및 Map() 생성자 사용

이제 일반 객체를 ES6 맵으로 변환하는 또 다른 방법을 살펴보겠습니다. 이 방법에는 다음 단계가 포함됩니다

• for...in 루프를 사용하여 객체의 속성을 반복합니다

• Map.set() 메서드를 사용하여 새 Map 객체에 추가하세요.

Example

다음은 for...in 루프와 Map() 생성자를 사용하여 일반 객체를 ES6 Map으로 변환하는 방법에 대한 예입니다. -

으아악

이 방법에서는 지도 속성을 반복하고 설정하므로 이 방법이 첫 번째 방법보다 효율성이 떨어질 수 있습니다.

그러나 이 방법은 열거할 수 없는 속성과 기호를 키로 사용하는 속성이 있는 객체에도 적용됩니다.

방법 3: Object.keys() 및 Array.prototype.forEach() 사용

이 방법에서는 아래 단계를 따릅니다. -

• 먼저 Object.keys(obj)를 사용하여 객체 키 배열을 가져옵니다.

• 그런 다음 Array.prototype.forEach() 메서드를 사용하여 키를 반복합니다

• 그런 다음 Map.set() 메서드를 사용하여 키-값 쌍을 지도에 추가합니다.

예

으아악

for...in 루프, Object.keys() 및 Array.prototype.forEach() 메서드는 모두 원래 정의와 다른 순서로 속성 개체를 반환한다는 점을 기억하는 것이 중요합니다. 속성은 열거 순서로 반환됩니다.

그러나 Map() 함수 메서드는 전달된 순서대로 키-값 쌍을 반환합니다.

결론

프로젝트의 특정 요구 사항에 따라 요구 사항에 가장 적합한 방법을 선택할 수 있습니다. 사용 사례에서 순서가 중요한 경우 Map() 생성자 메서드가 최선의 선택이라는 점을 명심하세요. 그렇지 않으면 다른 메서드가 제대로 작동합니다.

위 내용은 JavaScript를 사용하여 일반 객체를 ES6 맵으로 변환하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!