map()은 모든 배열 요소에 대해 함수를 호출하여 새 배열을 만듭니다. 빈 요소에 대해 함수를 실행하거나 원래 배열을 변경하지 않습니다. JavaScript Map은 효율적인 데이터 검색 및 조작을 가능하게 하는 키-값 쌍의 모음입니다.
반복 시 지도 객체는 삽입된 것과 동일한 순서로 키와 값 쌍을 반환합니다. 맵() 생성자 JavaScript에서 지도를 만드는 데 사용됩니다.
자바스크립트 지도 지도의 크기를 나타내는 속성이 있습니다.
예:
Input: let map1 = new Map([ [1 , 10], [2 , 20] , [3, 30],[4, 40] ]); console.log('Map1: '); console.log(map1); Output: // Map1: // Map(4) { 1 =>10, 2 => 20, 3 => 30, 4 => 40 }>지도를 만드는 단계
- 배열 전달
new Map()> - 지도를 만들고 활용하세요
Map.set()>
JavaScript 맵의 예
새로운 지도()
이것에서 우리는new Map()>건설자,
예: 이 예에서는 이름이 지정된 지도prices>상품명과 해당 가격을 연관시키기 위해 생성되어 가격 정보를 효율적으로 검색하고 관리할 수 있습니다.
// Creating a Map for product prices const prices = new Map([ ['Laptop', 1000], ['Smartphone', 800], ['Tablet', 400] ]);>
지도.세트()
다음을 사용하여 지도에 요소를 추가할 수 있습니다.set()>방법.
예: 이 예에서는 Map.set()> 메소드는 이름이 지정된 지도에 제품 가격을 추가하는 데 사용됩니다.prices>.
// Creating a Map for product prices const prices = new Map(); // Using Map.set() to add product prices prices.set('Laptop', 1000); prices.set('Smartphone', 800); // The Map now contains { 'Laptop' =>1000, '스마트폰' => 800 }>예시 1: 이 예에서는 기본 지도 객체를 생성합니다.
자바스크립트 let map1 = new Map([ [1, 2], [2, 3], [4, 5] ]); console.log('Map1'); console.log(map1); let map2 = new Map([ ['firstname', 'sumit'], ['lastname', 'ghosh'], ['website', 'geeksforgeeks'] ]); console.log('Map2'); console.log(map2);> 산출
Map1 Map(3) { 1 =>2, 2 => 3, 4 => 5 } Map2 Map(3) { '이름' => 'sumit', '성' => 'ghosh', 'website' => 'geeksforgeeks' }> 예시 2: 이 예에서는 다음을 사용하여 지도에 요소를 추가합니다. 세트() 방법.
자바스크립트 let map1 = new Map(); map1.set('FirstName', 'Shobhit'); map1.set('LastName', 'Sharma'); map1.set('website', 'techcodeview.com'); console.log(map1);> 산출
Map(3) { 'FirstName' =>'Shobhit', '성' => 'Sharma', 'website' => 'techcodeview.com' }> 예시 3: 이 예에서는 다음과 같은 Map 메소드의 사용을 설명합니다. 가지다() , 얻다() , 삭제() , 그리고 분명한() .
자바스크립트 let map1 = new Map(); map1.set('first name', 'sumit'); map1.set('last name', 'ghosh'); map1.set('website', 'geeksforgeeks') .set('friend 1','gourav') .set('friend 2','sourav'); console.log(map1); console.log('map1 has website ? '+ map1.has('website')); console.log('map1 has friend 3 ? ' + map1.has('friend 3')); console.log('get value for key website '+ map1.get('website')); console.log('get value for key friend 3 '+ map1.get('friend 3')); console.log('delete element with key website ' + map1.delete('website')); console.log('map1 has website ? '+ map1.has('website')); console.log('delete element with key website ' + map1.delete('friend 3')); map1.clear(); console.log(map1);> 산출
Map(5) { 'first name' =>'sumit', '성' => 'ghosh', '웹사이트' => 'geeksforgeeks', '친구 1' => 'gourav', '친구 2' => 'sourav' } map1에는 웹사이트가 있습니까? true map1에는 친구 3이 있습니까? 거짓 획득...> 지도의 장점:
지도 에서 제공하는 객체 ES6 . 지도의 키는 한 번만 발생할 수 있으며 지도 컬렉션에서 고유합니다. 객체 대신 지도를 사용하면 약간의 이점이 있습니다.
- 실수로 인한 키 및 보안: 기본 키는 저장되지 않으며 명시적으로 입력된 내용만 포함됩니다. 그렇기 때문에 안심하고 사용하실 수 있습니다.
- 키 유형 및 순서: 핵심 기능으로 어떤 값이든 객체가 될 수 있습니다. 그리고 순서는 항목 삽입 순서대로 간단합니다.
- 크기: 크기 속성으로 인해 지도를 쉽게 검색할 수 있습니다.
- 성능: 어떤 작업이든 수학에서 더 나은 방법으로 쉽게 수행할 수 있습니다.
- 직렬화 및 구문 분석: 다음을 사용하여 Map에 대한 자체 직렬화 및 구문 분석 지원을 만들 수 있습니다. JSON.stringify() 그리고 JSON.parse() 행동 양식.
지원되는 브라우저:
- 구글 크롬
- 가장자리
- 파이어폭스
- 오페라
- 원정 여행