4.ES6新增（三）Set和Map

目录

ES6的Set和Map数据结构 ：

一：Set集合

1.声明set集合 里面放的是有Iterator迭代器接口的

2.Set集合的方法

①set集合能去除重复元素

②输出 a 的个数  用size不用length

③向a集合添加新元素add

④在a中删除1  delete

⑤判断a中是否有600   返回的是布尔值  has

⑥清空a中的元素  clear

⑦for...of遍历（只能遍历迭代器的）

3.Set集合的应用题

①数组去重

②交集

③并集

④差集 （b1对b2的差集是3，4，5）  （b2对b1的差集是7，8，9）

二：Map集合

1.它存储有三个注意点：

2.声明：

3. Map集合方法

①添加元素  set

②获取元素    get

③删除元素  delete

④查看是否有某个元素 has

⑤元素个数

⑥清空

4.Map可以做什么？？？  可以做缓存。。。

---

ES6的Set和Map数据结构 ：

Set和Map主要的应用场景在于数组去重和数据存储，

Set是一种叫做集合的数据结构，Map是一种叫做字典的数据结构

集合

• 集合是由一组无序且唯一(即不能重复)的项组成的，可以想象成集合是一个既没有重复元素，也没有顺序概念的数组
• ES6提供了新的数据结构Set。它类似于数组，但是成员的值都是唯一的，没有重复的值
• Set 本身是一个构造函数，用来生成 Set 数据结构
• 这里说的Set其实就是我们所要讲到的集合

字典

• 在数据结构还有一种结构叫做字典，它就是实现基于ES6中的Map类的结构

那么集合又和字典有什么区别呢：

• 共同点：集合、字典可以存储不重复的值
• 不同点：集合是以[值，值]的形式存储元素，字典是以[键，值]的形式存储

所以这一下让我们明白了，Map其实的主要用途也是用于存储数据的，相比于Object只提供了“字符串—值”的对应，Map提供了“值—值”的对应。也就是说如果你需要“键值对”的数据结构，Map比Object更合适

 一文吃透 JavaScript 中 Object 和 Map 的区别

Object 是键值对的集合，但键只能是字符串。而 Map 的键可以是任意类型。
比如，如果用数字作 Object 的键，则该数字将转换为字符串。
因为键已经被转换成字符串，所以无论我们是获取数字 1 还是字符串 '1' 的值时，得到的结果都一样。
而 Map 的键可以为任意类型，数字 1 的键和字符串 '1' 的键并不一样。

一：Set集合

Set集合是一种没有重复元素、有序列表，参数必须是一个可迭代对象。一般的我们不会像访问数组一样逐一的访问每个元素，通常的做法是检测给定的值在某个集合中是否存在；通过Set集合可以快速访问其中的数据，更有效的追踪各种离散值。

1.声明set集合 里面放的是有Iterator迭代器接口的

        let a = new Set([1, 2, 3])
        console.log(a)   //Set(3) {1, 2, 3}

2.Set集合的方法

①set集合能去除重复元素

        let b = new Set([1, 1, 1, 6, 8, 8, 6,])
        console.log(b)    //Set(3) {1, 6, 8}

②输出 a 的个数  用size不用length

        // 3.输出 a 的个数  用size不用length
        console.log('a的长度：' + a.size)  //3

③向a集合添加新元素add

        a.add(800)
        console.log(a)       //Set(4) {1, 2, 3, 800}

④在a中删除1  delete

        a.delete(1)
        console.log(a)          //Set(3) {2, 3, 800}

⑤判断a中是否有600   返回的是布尔值  has

        console.log(a.has(600))   //false

⑥清空a中的元素  clear

        a.clear()
        console.log(a)              //Set(0) {}

⑦for...of遍历（只能遍历迭代器的）

        for (var i of b) {
            console.log(i)
        }
        // 逐个输出
        //1
        //6
        //8

3.Set集合的应用题

①数组去重

        let a = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5]
        let newA = new Set(a)
        console.log(newA)  //此时已去重，但是是set集合方式输出不是数组形式[]
        console.log('数组形式新c：' + [...newA])   //(5) [1, 2, 3, 4, 5] 以数组形式输出

②交集

        let b1 = [1, 2, 3, 4, 5, 1]
        let b2 = [1, 2, 7, 8, 9, 1]
        // filter 是 遍历每个元素筛选  
        let jiaoji = [...new Set(b1)].filter(function fn(item) {
            return (new Set(b2)).has(item)
        })
        console.log(jiaoji)   //(2) [1, 2]

③并集

        let bingji = [...new Set(b1), ...new Set(b2)]
        console.log([...new Set(bingji)]) //(8) [1, 2, 3, 4, 5, 7, 8, 9]

④差集 （b1对b2的差集是3，4，5）  （b2对b1的差集是7，8，9）

        let chaji = [...new Set(b1)].filter(function fn(item) {
            return !(new Set(b2)).has(item)
        })
        console.log(chaji)  //(3) [3, 4, 5]

二：Map集合

以键值对形式进行存储，键名不能重复。   Map集合的键名和值支持任意类型的数据

1.它存储有三个注意点：

键名只能是字符串

获取对象的数量不方便

键名容易和原型上的方法名发生冲突

2.声明：

参数传递的形式一般为二维数组的形式，数组的子数组只能有两项，第一项为键名，第二项为值

比如 m.a=123  

        const m = new Map([
            ['a', 123],
            ['b', 456],
            ['c', 789]
        ]);
        console.log(m);   //Map(3) {"a" => 123, "b" => 456, "c" => 789}

3. Map集合方法

①添加元素  set

        m.set('d', 10)
        console.log(m)   //Map(4) {"a" => 123, "b" => 456, "c" => 789, "d" => 10}

②获取元素    get

        console.log(m.get('a'))   //123

③删除元素  delete

        m.delete('b')
        console.log(m)   //Map(3) {"a" => 123, "c" => 789, "d" => 10}

④查看是否有某个元素 has

        console.log(m.has('c'))   //true

⑤元素个数

        console.log(m.size)    //3

⑥清空

        m.clear()
        console.log(m)        //Map(0) {}

4.Map可以做什么？？？  可以做缓存。。。