JavaScript学习笔记(Map、Set、iterable)

JavaScript的默认对象表示方式{}可以视为其他语言中的Map或者Dictionary的数据结构,是一组键值对。
Map:是一组键值对的结构,具有极快的查找速度。

var m = new Map([['michael',95],['Bob',75],['zs',85]]);
console.log(m.get('zs'));

初始化的使用:

var m = new Map();
m.set('zs',67);
m.set('ls',100);
//是否存在key 'zs':true
m.has('zs');
// 67
m.get('zs');
//删除key 'zs'
m.delete('zs');
m.get('ls');

由于一个key只能对应一个value,所以,多次对一个key放入value,后面的值会把前面的值冲掉:

var m = new Map();
m.set('admin',67);
m.set('admin',88);
m.get('admin');//88

Set

也是一组key的集合,但是不存储value,由于key不能重复,所以在Set中,没有重复的key,

在Set中重复的元素会自动被过滤掉

var s = new Set([1, 2, 3, 3, '3']);
s; // Set {1, 2, 3, "3"};
//添加元素到s中
s.add(4);
//删除元素
s.delete(2)

总结:

Map和Set是ES6标准新增的数据类型,请根据浏览器的支持情况决定是否要使用。

iterable
通常情况下遍历Array可以采用下标循环,但是在遍历Map和Set就无法使用下标为了统一集合类型,ES6标准引入了新的iterable类型,Array、Map和Set集合都属于iterable类型。
iterable集合可以通过for…of循环来遍历
例如:

var m = new Map();
var s = new Set();
	
m.set('zs',10);
m.set('ls',20);

s.add(12);
s.add(15);

for (var x of s) {
	console.log("Set:"+x);
}
for (var x of m) {
	console.log("Map:"+x);
}

在这里插入图片描述
两者的区别:

for...in循环遍历的是集合的索引名
for...of循环则只遍历集合本身的元素`

例子:

var a = ['a','b','c'];
a.name = 'hello';

for(var x in a){
	console.log("for...in:"+x);
}
for (var  s of a) {
	console.log("for...of:"+s);
}

在这里插入图片描述
使用for…of是为了更好的使用iterable内置的forEach方法

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


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

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

Map的回调函数参数依次为value、key和map本身:

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

如果对某些参数不感兴趣,由于JavaScript的函数调用不要求参数必须一致,因此可以忽略它们。例如,只需要获得Array的element:

var a = ['A', 'B', 'C'];
a.forEach(function (element) {
    console.log(element);
});
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章