js中的set和map

ES6中新增的Map和Set两种新的数据结构

Map是类似Object的一种键值对集合，区别在于Map的键不仅限于是字符串，其他各种类型的值包括对象都可以为Map的键

// 创建一个Map
const a = new Map()
// 往Map里面添加键，值
a.set(0, 'a')  // Map(1) {0 => 'a'}
// 根据键获取对应值
a.get(0)  // 'a'
// has方法可以用来检测Map是否包含某个key对应的元素
let isHasA = a.has(0) // 结果为true
// 删除
let ADelete = a.delete(0) // 结果是 删除true
//另外,因为一个key只能对应一个value,所以多次对一个key放入value,后面的值会覆盖前面的值

Set是类似数组的一种数据结构，不同点在于Set中没有重复的值

// 创建一个Set, set中没有重复的值
const set = new Set([1,1,2,3,4,4,2]) //  Set(4) {1, 2, 3, 4}
// 添加元素 add(value): 添加某个值，返回Set结构本身
set.add(66) // Set(5) {1,2,3,4,66}
// 删除元素  delete(value): 删除某个值，返回一个布尔值，表示删除是否成功 
set.delete(1)  // true
// 长度
set.size  // 4
// has(value): 返回一个布尔值，表示该值是否为Set的成员 
set.has(1) // true
//  clear(): 清除所有成员，没有返回值

迭代器 iterable,可以用于Map Set和Array

// 创建一个Map
var oneMap = new Map([
				['zhang', 90],
				['wang', 91],
				['bai', 88]
			]);
// 具有iterable类型的集合，可以通过新的for...of循环遍历，并且遍历得到的是value，而不是key
for ( let x of oneMap) {
	console.log(x.toString())
	// zhang,90
    // wang,91
     // bai,88
}
// 对于map集合，可以获取key以及对应的value
for( let x of oneMap) {
	console.log(x[0] +" " +x[1])
	zhang 90
    wang 91
    bai 88
}
// 创建一个set集合
var secondSet = new Set();
secondSet.add('li');
// 对于set集合
for( let x of secondSet) {
	console.log(x); // 结果是li
}

for… in和for…of的区别

// for...in实际上遍历的是对象的属性名称，对于数组Array来说，实际上也是对象，它的每个元素的索引都被视为属性；当我们手动给数组对象添加额外的属性时候，使用for...in就会带来意外的效果
let myArray = [1, 3, 5]
myArray.name = 'heihei';
for(let x in myArray) {
	console.log(x); // 结果是0 1 2 name ,会把name也遍历出来
}
// 但是使用for...of就不会出现这样的问题，它只循环集合本身的元素
for(let x of myArray) {
	console.log(x);  // 结果是 1 3 5
}
// forEach方法是iterable内置的方法,接收一个函数,每次迭代就自动回调该函数
myArray.forEach(function(element, index, array) {
	// element: 指向当前元素的值
	// index: 指向当前索引
	// array: 指向Array对象本身
	console.log(element + ', index = ' + index);
}
// 对Map集合来说,第一个参数value,第二个参数是key;
oneMap.forEach(function(value,key,map) {
	console.log(value + ', key = ' + key);
})
对于set集合来说,因为没有索引,所以第一个第二个参数都是value
secondSet.forEach(function(value,sameValue,set){
	console.log(value + ', sameValue = ' + sameValue);
})
// 另外,js函数调用不要求参数一致,所以如果我们只关心value,可以这么写
myArray.forEach(function(element){
	console.log(element);
	//结果是 1 3 5 
})