【ES6入门09】：Set和Map数据结构

摘要：类似于与的区别和的对比与对比数据结构横向对比，增查改删增查改删与对比增查改删与对比增查改删建议优先使用，不使用，特别是复杂的数据结构考虑数据唯一性，使用，放弃和

1.add()方法和size属性

{
    let list = new Set();
    // add()方法向Set数据添加元素
    list.add(5);
    list.add(7);
    // size属性返回数据的长度
    console.log(list.size); // 2

    let arr = [1, 2, 3, 4, 5];
    let set = new Set(arr);
    console.log(set, set.size); // Set(5) {1, 2, 3, 4, 5} 5
}

2.Set的元素必须是唯一的

{
    let list = new Set();
    list.add(1);
    list.add(2);
    list.add(1); // 重复元素不会添加进去
    console.log(list); // Set(2) {1, 2}

    // 数组去重
    let arr = [1, 2, 3, 1, "2"];
    let list2 = [...new Set(arr)];
    console.log(list2); // [1, 2, 3, "2"]
}

3.has(),delete(),clear()

{
    let arr = ["add", "delete", "clear", "has"];
    let list = new Set(arr);
    console.log(list.has("add")); // true
    list.delete("add");
    console.log(list); // Set(3) {"delete", "clear", "has"}
    list.clear();
    console.log(list); // Set(0) {}
}

4.Set的遍历

{
    let arr = ["add", "delete", "clear", "has"];
    let list = new Set(arr);
    // Set结构的数据，key和value是同一个值
    for (let value of list) {
        console.log("value", value); // "add" "delete" "clear" "has"
    }
    for (let key of list.keys()) {
        console.log("keys", key); // "add" "delete" "clear" "has"
    }
    for (let value of list.values()) {
        console.log("values", value); // "add" "delete" "clear" "has"
    }
    for (let [key, value] of list.entries()) {
        console.log("entries", key, value);
    }
    list.forEach(function (item) {
        console.log(item); // "add" "delete" "clear" "has"
    });
}

WeakSet和Set的不同点：

WeakSet的元素只能是对象，不能是数值、字符串、布尔值...

WeakSet中的对象都是弱引用，垃圾回收机制不考虑WeakSet对该对象的引用。WeakSet里面的引用，都不计入垃圾回收机制，所以不会引发内存泄漏的问题。所以，WeakSet适合临时存放一组对象，以及存放跟对象绑定的信息。只要这些对象在外部消失，它在WeakSet里面的引用就会自动消失。

{
    let weakList = new WeakSet();
    let arg = {name: "hhh"};
    weakList.add(arg); // WeakSet的元素只能是对象
    // weakList.add(2); // Uncaught TypeError: Invalid value used in weak set
    console.log(weakList); // WeakSet {{name: "hhh"}}
    // 注意：WeakSet没有size属性，没有clear方法，不能遍历。其他的用法和Set相同
}

1.set()方法和get()方法

{
    let map = new Map();
    let arr = ["123"];
    // Map的key可以是任意数据类型
    map.set(arr, 456); // map.set(key, value)，这里用数组作为key,添加一个值为456的元素
    console.log(map.get(arr)); // 456
}

2.Map的另一种定义方式

{
    let map = new Map([["a", 123], ["b", 456]]); // 接收一个数组作为参数，数组的每一项为：[key,value]
    console.log(map); // Map(2) {"a" => 123, "b" => 456}
    console.log(map.size); // 2
    console.log(map.has("b")); // true
    map.delete("a");
    console.log(map); // Map(1) {"b" => 456}
    map.clear();
    console.log(map); // Map(0) {}
}

WeakMap和Map的不同点：

WeakMap的key只能是对象

WeakMap的键名所引用的对象都是弱引用，垃圾回收机制不考虑对此对象的引用。（注意，WeakMap弱引用的只是键名，而不是键值。键值依然是正常引用。）基本上，如果你要往对象上添加数据，又不想干扰垃圾回收机制，就可以使用WeakMap。

{
    let weakmap = new WeakMap();
    let o = {};
    weakmap.set(o, 123);
    console.log(weakmap.get(o)); // 123
    // 注意：WeakMap没有size属性，没有clear方法，不能遍历。类似于Set与WeakSet的区别
}

{
    // 数据结构横向对比，增 查 改 删
    let map = new Map();
    let array = [];

    // 增
    map.set("t", 1);
    array.push({"t": 1});
    console.log(map, array); // {"t" => 1} [{"t": 1}]

    // 查
    let map_exist = map.has("t");
    let array_exist = array.find(item => item.t);
    console.log(map_exist, array_exist); // true {t: 1}

    // 改
    map.set("t", 2);
    array.forEach(item => item.t ? item.t = 2 : "");
    console.log(map, array); // {"t" => 2} [{"t": 2}]

    // 删
    map.delete("t");
    let index = array.findIndex(item => item.t);
    array.splice(index, 1);
    console.log(map, array); // {} []
}

{
    let set = new Set();
    let array = [];
    let item = {"t": 1};

    // 增
    set.add(item);
    array.push(item);
    console.log(set, array); // {{"t": 1}} [{"t": 1}]

    // 查
    let set_exist = set.has(item);
    let array_exist = array.find(item => item.t);
    console.log(set_exist, array_exist); // true {t: 1}

    // 改
    set.forEach(item => item.t ? item.t = 2 : "");
    array.forEach(item => item.t ? item.t = 2 : "");
    console.log(set, array); // {{"t": 2}} [{"t": 2}]

    // 删
    set.forEach(item => item.t ? set.delete(item) : "");
    let index = array.findIndex(item => item.t);
    array.splice(index, 1);
    console.log(set, array); // {} []
}

{
    let item = {t: 1};
    let map = new Map();
    let set = new Set();
    let obj = {};

    // 增
    map.set("t", 1);
    set.add(item);
    obj["t"] = 1;
    console.log(obj, map, set); // {t: 1} Map(1) {"t" => 1} Set(1) {{t: 1}}

    // 查
    console.log(map.has("t"), set.has(item), "t" in obj); // true true true

    // 改
    map.set("t", 2);
    item.t = 2;
    obj["t"] = 2;
    console.log(obj, map, set); // {t: 2} Map(1) {"t" => 2} Set(1) {{t: 2}}

    // 删
    map.delete("t");
    set.delete(item);
    delete obj["t"];
    console.log(obj, map, set); // {} Map(0) {} Set(0) {}
}

建议：

优先使用map，不使用array，特别是复杂的数据结构

考虑数据唯一性，使用set，放弃array和obj