>  기사  >  웹 프론트엔드  >  JavaScript의 Map 및 Set 인스턴스에 대한 자세한 설명

JavaScript의 Map 및 Set 인스턴스에 대한 자세한 설명

零下一度
零下一度원래의
2017-06-26 10:12:091273검색

Map

 Map은 키-값 쌍의 집합 구조로, 검색 속도가 매우 빠릅니다.

 지도의 정의.

//空map设值key-valuevar m = new Map();
m.set("XiaoMing",99);
m.set("XiaoHong",66);//构造参数传key-valuevar m = new Map([['XiaoMing', 99], ['XiaoHong', 66]]);

맵의 메소드

var m = new Map(); // 空Mapm.set('XiaoMing', 99); // 添加新的key-valuem.has('XiaoMing'); // 是否存在key 'XiaoMing': truem.get('XiaoMing'); // 99m.delete('XiaoMing'); // 删除key 'XiaoMing'm.get('XiaoMing'); // undefined

키 값을 반복적으로 설정하면 후속 값이 이전 값을 덮어씁니다.

var m = new Map();
m.set('XiaoMing', 99);
m.set('XiaoMing', 98);
m.get('XiaoMing'); // 98

Set

Set은 Map과 유사하지만, Set은 키를 저장하고 키가 반복되지 않습니다.

 세트 제작.

var s1 = new Set(); // 空Sets1.add(1);
s1.add(2);
s1.add(3);var s2 = new Set([1, 2, 3]); // 含1, 2, 3

중복 값을 삽입하면 set이 중복 값을 필터링합니다.

 s =  Set([1, 2, 33>>s; s.delete(3);
>>s;

Map 및 Set의 순회

Array는 루프 순회에 첨자를 사용할 수 있지만 Map 및 Set에서는 첨자를 사용할 수 없습니다. 컬렉션 유형을 통합하기 위해 ES6 표준에서는 Array, Map 및 Set이 모두 iterable 유형에 속합니다.

iterable 유형의 컬렉션은 새로운 for ... of 루프를 통해 탐색할 수 있습니다. iterable类型的集合可以通过新的for ... of循环来遍历。

var a = ['A', 'B', 'C'];var s = new Set(['A', 'B', 'C']);var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);for (var x of a) { // 遍历Array    alert(x);
}for (var x of s) { // 遍历Set    alert(x);
}for (var x of m) { // 遍历Mapalert(x[0] + '=' + x[1]);
}

更好的遍历:forEach

 forEach是iterable内置的方法,它接收一个函数,每次迭代就自动回调该函数。

var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {// element: 指向当前元素的值// index: 指向当前索引// array: 指向Array对象本身    alert(element);
});

 SetArray类似,但Set没有索引,因此回调函数的前两个参数都是元素本身:

var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
    alert(element);
});

 Map的回调函数参数依次为valuekeymap

var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
    alert(value);
});

더 나은 순회: forEach

🎜🎜🎜 🎜forEach는 내장된 iterable 메서드이며, 반복할 때마다 자동으로 함수를 호출합니다. 🎜🎜rrreee🎜🎜 SetArray와 유사하지만 Set에는 인덱스가 없으므로 콜백 함수의 처음 두 매개변수가 요소입니다. 🎜 🎜rrreee🎜🎜  Map의 콜백 함수 매개변수는 value, keymap 자체입니다. 🎜 🎜rrreee🎜 🎜 🎜

위 내용은 JavaScript의 Map 및 Set 인스턴스에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.