js_set.html

最新推荐文章于 2024-08-21 10:18:56 发布

学无止境慢慢来

最新推荐文章于 2024-08-21 10:18:56 发布

阅读量377

点赞数

分类专栏： js

原文链接：https://blog.csdn.net/DurianPudding/article/details/88116732

版权

js 专栏收录该内容

132 篇文章 0 订阅

订阅专栏

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js_set</title>
</head>
<body>

<script>
    /*参考：https://blog.csdn.net/DurianPudding/article/details/88116732
    * 知识点：
    *   1.集合添加值。
    *       let s = new Set();
    *       s.add(value);
    *   2.Set 结构不会添加全等（===）的值，集合有去重的功能。
    *   3.集合中可以容纳的数据类型包括：字符串，数字，对象，NaN 等。
    *   4.set.add() -> set 对象。*/
    // 0.集合的声明、初始化。
    let s = new Set();
    let s2 = new Set([1, 2, 3, 4, 4]);
    console.log("s2:", s2);
    console.log(s2.size);
    // s2: Set(4) {1, 2, 3, 4}
    // 4

    // 1.集合转换成数组。
    console.log("\n1.");
    console.log([...s2]);
    console.log(Array.from(s2));
    // (4) [1, 2, 3, 4]
    // (4) [1, 2, 3, 4]
    // 数组去重。
    let arr = [1, 1, 2, 2];
    console.log([...new Set(arr)]);
    console.log(Array.from(new Set(arr)));
    // (2) [1, 2]
    // (2) [1, 2]

    // 2.把数组的值添加到集合。
    console.log("\n2.");
    [2, 2, 2, 3, 5, 5].forEach(x => s.add(x));
    console.log("s:", s);
    // s: Set(3) {2, 3, 5}

    // 4.集合中的值的比较。
    // set 中 NaN 等于自身，其余比较相当于 ===
    // 值有不全等的值才会被添加。
    console.log("\n4.");
    let s3 = new Set();
    s3.add(NaN);
    s3.add(NaN);
    console.log("s3:", s3);
    // s3: Set(1) {NaN}
    let o = {a: 1, b: 2};
    s3.add(o);
    s3.add(o);
    console.log("s3:", s3);  // 因为 o === o，所以只添加了一次。
    // s3: Set(2) {NaN, {a: 1, b: 2}}
    console.log({a: 1, b: 2} === {a: 1, b: 2}); // false
    s3.add({a: 1, b: 2});
    console.log("s3:", s3);
    // s3: Set(3) {NaN, {a: 1, b: 2}, {a: 1, b: 2}}
    // 这里体现了对象之间引用不同不全等，即使值相同。

    // 5.set.add() -> set 对象。
    //      所以，可以链式操作。
    console.log("\n5.");
    let s4 = new Set();
    s4.add("hello world!");
    s4.add("hello world!").add("hello China!");
    console.log("s4:", s4);
    // s4: Set(2) {"hello world!", "hello China!"}

    // 6.成员判断。
    console.log("\n6.");
    console.log(s4.has("hello China!"));  // true

    // 7.删除成员
    console.log("\n7.");
    console.log("s4:", s4);
    s4.delete("hello world!");
    console.log("s4:", s4);
    // s4: Set(2) {"hello world!", "hello China!"}
    // s4: Set(1) {"hello China!"}

    // 8.集合的遍历。
    // set 键名=键值
    console.log("\n8.");
    let set = new Set(['red', 'green', 'blue']);
    console.log("set:", set);
    // set: Set(3) {"red", "green", "blue"}
    console.log("set.keys():", set.keys());
    // set.keys(): SetIterator {"red", "green", "blue"}
    // 返回键名
    for (let item of set.keys()) {
        console.log(item);  // red green blue
    }
    console.log("set.values():", set.values());
    // set.values(): SetIterator {"red", "green", "blue"}
    // 返回键值
    for (let item of set.values()) {
        console.log(item);  // red green blue
    }
    console.log("set.entries():", set.entries());
    // 返回键值对
    for (let item of set.entries()) {
        console.log(item);
    }
    // set.entries(): SetIterator {"red" => "red", "green" => "green", "blue" => "blue"}
    // (2) ["red", "red"]
    // (2) ["green", "green"]
    // (2) ["blue", "blue"]

    for (let i of set) {
        console.log(i);  // red green blue
    }
    set.forEach(value => console.log(value));  // red green blue


    // 以下代码未整理。
    // // 数组的 map 和 filter 方法也可以间接用于Set
    // let s = new Set([1, 2, 3]);

    // // map 将原数组映射成新数组
    // s = new Set([...s].map(x => x * 2));
    // console.log(s);
    //
    // // filter返回过滤后的新数组
    // s = new Set([...s].filter(x => (x % 3) == 0));
    // console.log(s);
    //
    // // 实现并集、交集、差集
    // let a = new Set([1, 2, 3]);
    // let b = new Set([4, 3, 2]);
    //
    // let union = new Set([...a, ...b]);
    // console.log(union);
    //
    // let intersect = new Set([...a].filter(x => b.has(x)));
    // console.log(intersect);
    //
    // let difference = new Set([...a].filter(x => !b.has(x)));
    // console.log(difference);
    //
    // // 在遍历操作中，同步改变原来的Set结构的两种变通方法
    //
    // // 1.利用原Set结构映射出一个新的结构，然后赋值给原来的Set结构
    // let set1 = new Set([1, 2, 3]);
    // set1 = new Set([...set1].map(val => val * 2));
    // console.log(set1);
    //
    // // 2.利用Array.from
    // let set2 = new Set([1, 2, 3]);
    // set2 = new Set(Array.from(set2, val => val * 2));
    // console.log(set2);
</script>

</body>
</html>