map은 참조 유형이고, map(set)은 es6에 추가된 새로운 참조 데이터 유형으로, 데이터의 매핑 관계를 나타냅니다. 맵 컬렉션 데이터 유형의 데이터는 "키/값" 방식으로 저장됩니다. 객체의 속성을 키로 사용하고 해당 속성을 사용하여 값을 참조할 수 있습니다. 예를 들어 "const"를 사용하여 맵을 생성할 수 있습니다. myMap = 새 맵();" .
이 튜토리얼의 운영 환경: Windows 7 시스템, ECMAScript 버전 6, Dell G3 컴퓨터.
지도는 참조형입니다.
ES6 이전에는 우리가 흔히 키-값 쌍이라고 부르는 'key' => 'value'를 JavaScript로 구현하는 것이 Object를 사용하여 이루어졌습니다. 그러나 이 구현 방법은 특별한 시나리오에서 문제가 있습니다. ES6은 언어에 진정한 키-값 쌍 저장 메커니즘을 제공하는 Map이라는 새로운 컬렉션 유형을 도입했습니다.
map(set)은 es6의 새로운 참조 데이터 유형으로, 지도 컬렉션 데이터 유형의 데이터 매핑 관계를 나타내며 "키/값" 방식으로 저장되며 객체의 속성을 사용할 수 있습니다. 키로 속성을 사용하여 값을 참조합니다.
지도를 인스턴스화하려면 new
키워드를 사용하세요.new
关键字来实例一个map
let m = new Map(); console.log(m); // Map(0) {}
创建时初始化:
传入一个二维数组参数(可迭代对象,内部以数组的方式传入键值)
每个子数组,第一个元素是map对应的key
, 第二个元素是map对应的value
let m = new Map([[{}, 222], [{}, '123']]); console.log(m); // Map(2) { {} => 222, {} => '123' }
通过set()方法添加,传入两个参数,第一个传入映射的键,第二个传入映射的值。返回的是该映射集合(意味着可以链式添加)
let m = new Map(); m.set('prop', '值'); console.log(m); // Map(1) { 'prop' => '值' }
链式添加键值
let m = new Map(); m.set('prop', '值').set('prop2', false).set('num', {id: 13}); console.log(m); // Map(3) { 'prop' => '值', 'prop2' => false, 'num' => { id: 13 } }
使用size
let m = new Map(); m.set('prop', '值').set('prop2', false).set('num', {id: 13}); console.log(m.size);
key
이고 두 번째 요소는 값</code입니다. > 해당 map</a><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">let m = new Map();
m.set(&#39;prop&#39;, &#39;值&#39;).set(&#39;prop2&#39;, false).set(&#39;num&#39;, {id: 13});
console.log(m.get(&#39;prop2&#39;));
// false</pre><div class="contentsignin">로그인 후 복사</div></div> <strong><a id="12_Map_Api_24"></strong></h3><p>1-2 Map Api</p><h3><a id="124__66"></a><a id="121__25"><strong></strong>1-2-1 매핑 요소 추가</h3><p></p>Add set() 메소드를 통해 두 개의 매개변수를 전달합니다. 첫 번째는 맵의 키이고 두 번째는 맵의 값입니다. 반환되는 것은 매핑 세트입니다(체인에 추가할 수 있음을 의미)<h3><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">let m = new Map();
m.set(&#39;prop&#39;, &#39;值&#39;).set(&#39;prop2&#39;, false).set(&#39;num&#39;, {id: 13});
m.delete(&#39;prop2&#39;);
// true
console.log(m.get(&#39;prop2&#39;), m.size);
// undefined 2</pre><div class="contentsignin">로그인 후 복사</div></div><a id="125__80">체인 키 값</a><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;">let m = new Map();
m.set(&#39;prop&#39;, &#39;值&#39;).set(&#39;prop2&#39;, false).set(&#39;num&#39;, {id: 13});
m.delete(&#39;prop2&#39;);
// true
console.log(m.has(&#39;prop2&#39;), m.has(&#39;num&#39;));
// false true</pre><div class="contentsignin">로그인 후 복사</div></div><strong><a id="122__45"></strong></h3>1-2-2 매핑 세트 길이<p></p><h3><코드 사용 > size
속성은 현재 컬렉션의 요소 수를 가져올 수 있습니다.let m = new Map(); m.set('prop', '值').set('prop2', false).set('num', {id: 13}); m.clear(); // true console.log(m); // Map(0) {}
get() 메서드를 통해 요소를 가져오고 키를 전달합니다. delete() 메서드를 통해 매핑된 컬렉션의 요소를 삭제하고, 삭제 성공 또는 실패를 나타내는 부울 값을 반환합니다. 1- 2-5 요소 존재 여부 감지 has() 메소드를 사용하여 대상 요소 존재 여부를 감지하고, 감지 결과의 Boolean 값을 반환rrreee map은 삽입 순서에 따라 요소를 반복할 수 있습니다 메모리 사용량브라우저의 차이로 인해 두 가지 저장 방법의 메모리 사용량이 달라집니다. 그러나 메모리 크기를 고려하면 맵은 약 50개 정도 저장됩니다. Object보다 키-값 쌍이 % 더 많습니다 위 내용은 es6 맵은 참조 유형입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!let m = new Map();
m.set('prop', '值').set('prop2', false).set('num', {id: 13});
console.log(m.entries === m[Symbol.iterator]);// true
for(let k1 of m.entries()){
console.log(k1);
// [ 'prop', '值' ]
// [ 'prop2', false ]
// [ 'num', { id: 13 } ]
// 遍历的属性即对应映射元素的键值对数组
}
for(let k2 of m.keys()){
console.log(k2);
// prop
// prop2
// num
// 遍历的属性对应映射元素的键
}
for(let k3 of m.values()){
console.log(k3);
// 值
// false
// { id: 13 }
// 遍历的属性对应映射元素的值
}
for(let k4 of m[Symbol.iterator]()){
console.log(k4);
// [ 'prop', '值' ]
// [ 'prop2', false ]
// [ 'num', { id: 13 } ]
// 遍历的属性即对应映射元素的键值对数组
}
rrreee
1-2-6 요소 지우기 방식
clear() 메소드를 사용하여 모든 요소를 삭제하고, 성공적으로 삭제된 부울 값을 반환합니다. Value1-3 시퀀스 및 반복
rrreee
1-4 Object와의 비교