ES6新增数据结构Set和Map详解

Set 数据解构

ES6提供了新的数据结构set，类似于数组，但是它的成员值都是唯一的，没有重复的值

• set本身是一个函数，用来生成set数据结构
• set函数可以接受一个数组作为参数，用来初始化

const s1 = new Set();
console.log(s1.size);

const s2 = new Set(['a','b']);
console.log(s2.size);

//利用set数据结构实现数组去重
const s3 = new Set(['a','b','c','c','a']);
console.log(s3.size);
let arr = [...s3];
console.log(arr);

Set 实例方法

• add(value);添加某个 值，返回Set结构本身
• delete(value);删除某个值，返回布尔值表示删除是否成功
• has(value);返回一个布尔值，表示该值是否为Set的成员
• clear();清除所有成员，没有返回值

const s1 = new Set();
//向Set结构里添加值，使用add方法
S1.add('a').add('b');
console.log(s1.size);
//从Set结构中删除值，使用delete方法
let r1 = s1.delete('a');
console.log(s1.size);
console.log(r1);//true代表删除成功
//判断某个值是否是Set数据结构中的成员，使用has方法
let r2 = s1.has('a');
console.log(r2);
//清空Set数据结构中的值，使用clear方法
S1.clear();
console.log(s1.size);//0

Set 遍历

• Set结构的实例与数组一样，也有forEach方法，用于对每个成员执行某种操作，没有返回值

const s1 = mew Set(['a','b','c']);
s1.forEach(value => {
    console.log(value)
});

Map数据结构

JavaScript的Object本身就是键值对的数据结构，但实际上属性和值构成的是”字符串-值“对，属性只能是字符串，如果传个对象字面量作为属性名，那么会默认把对象转换成字符串，结果这个属性名就变成”[object Object]“。

ES6提供了”值-值“对的数据结构，键名不仅可以是字符串，也可以是对象。它是一个更完善的Hash结构。

特性

• 键值对，键可以是对象

const map1 = new Map()
    const objKey = {realname: '张三'}

    map1.set(objKey, 'hello')
    console.log(map1.get(objKey))//hello

• Map可以接受数组作为参数，数组成员还是一个数组，其中有两个元素，一个表示键一个表示值。

const map2 = new Map([
  ['name', '张三'],
  ['age', 12]
])
console.log(map2.get('name'))
console.log(map2.get('age'))//张三,12

Map方法

• size —获取map的大小
• set —Map.set(key,value) 设置键值对，键名key对应的键值为value，键可以是各种类型，包括undefined，function，然后返回整个map结构。如果key已经有值，则键值会被更新，否则生成新的键
• get — Map.get(key) 读取key对应的键值，如果获取不到则返回undefined
• delete Map.delete(key) 删除某个键，如果删除成功返回true，否则返回false
• has Map.has(key) 判断某个键是否存在于map中，返回布尔值
• clear Map.clear() 清除所有数据，没有返回值
• keys Map.keys() 返回键名的遍历器
• values Map.values() 返回键值的遍历器
• entries Map.entries() 返回键值对的遍历器
• forEach map.forEach(function(){}) 使用回调遍历每一个成员

const myMap = new Map([
    ['realname','张三'],
    ['age',20]
]);
console.log(myMap);//realname => 张三，age => 20
//size
console.log(myMap.size);//2
//set
myMap.set('height',180).set('realname','里斯');
console.log(myMap);//realname => 里斯，age => 20，height => 180
//get
console.log(myMap.get('realname'));//里斯
//has
console.log(myMap.has('realname'));//true
//keys
console.log(myMap.keys());//{'realname','age','height'}
//values
console.log(myMap.values());//{'里斯',20,180}
//entries
console.log(myMap.entries());//realname => 里斯，age => 20，height => 180
//clear
console.log(myMap.clear());//undefined
console.log(myMap.size);//0