zoukankan      html  css  js  c++  java
  • set/weakset map/weakset

    set/weakset  map/weakset

    set用法

    定义:是ES6的一种新的数据结构及(值的集合)

    Set跟其他数据结构不同的地方就在于:它的值不会有重复项。


    (1)使用:

    1
    2
    3
    4
    let set = new Set([13,3,4,5])
    set.add(3)<br data-filtered="filtered">// add添加元素
    // 获取set中值的时候,需要先转成数组在取获取
    // set里的元素是不会重复的

      

    (2)size属性  获取成员的个数。

    1
    2
    3
    //数组的长度
    //length3
    console.log(set.size);//7

      

    (3)delete属性  用户删除Set结构中的指定值,删除成功返回:true,删除失败返回:fasle。

    1
    2
    3
    4
    5
    6
    //删除元素
    //pop
    //shift
     
    set.delete(32)
    console.log(set);

      

    (4)clear方法 清除所有成员

    1
    2
    3
    //清空set
        set.clear();
        console.log(set);//set(0)

      

    (5) has方法 判断set结构中是否含有指定的值。如果有,返回true;如果没有,返回fasle。

    1
    2
    3
    //判断是否存在
    console.log(set.has(1));//true
    console.log(set.has(32));//false

      

    (6) enteries 方法 返回一个键值对的遍历器。配合next使用

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    let set = new Set([1, 2, 3, 3, 3, 22, 4, 44, 444])
    let set1 = set.entries();
     console.log(set1.next());
     console.log(set1.next());
     console.log(set1.next());
     
     console.log(set1.next());
     console.log(set1.next());
     console.log(set1.next());
     
     
     console.log(set.keys());
     console.log(set.values());

      

    (7)keys和values方法

    keys()方法:返回键名的遍历器。
    values()方法:返回键值的遍历器。

    1
    2
    console.log(set.keys());
    console.log(set.values());

      

    (8)foreach方法  遍历每一个成员。

    1
    2
    3
    4
    //通过foreach 遍历
    set.forEach(item=>{
        console.log(item);
    })

      

    WeakSet结构

    WeakSet结构同样不会存储重复的值,不同的是,它的成员必须是对象类型的值。

    WeakSet提供了add()方法,delete()方法,has()方法;

    不会有keys(),values(),entries(),forEach()等方法和size属性。

    1
    2
    let weakset = new WeakSet([{name:"a"},{age:10}]);//数组里的数据是对象
    console.log(weakset);

      

    map的用法:

    键值对的集合:

    使用   

    1
    键可以是任何类型数据
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    let map = new Map([["key","这个键"]]);
    console.log(map);
     
    console.log(map.get("key"));
     
     
    //键可以是任何类型数据
    //数字
    map.set(3,"数字键")
    console.log(map.get(3))
     
    //布尔类型
    map.set(true,"键是布尔");
    console.log(map.get(true));
     
    //对象
    let obj = { name: "aa" };
    map.set( obj ,"对象");
     
    //symbol
    let symbol = Symbol("键");
    map.set(symbol,"键是symbol");

      

    (1)set()方法  作用:给实例设置一对键值对,返回map实例。 使用如上代码。

    (2)get方法   作用:获取指定键名的键值,返回键值。   使用如上代码。

    (3)delete方法    作用:删除指定的键值对,删除成功返回:true,否则返回:false。

    1
    2
    3
    //删除
    map.delete("key");// 键名
    //判断是否有指定键值对

      

    (4)clear 方法  作用:一次性删除所有键值对。

    1
    2
    3
    //清空键值对
    map.clear()
    console.log(map)

      

    (5)has方法   作用:判断Map实例内是否含有指定的键值对,有就返回:true,否则返回:false。

    1
    2
    //判断是否有指定键值对
    console.log(map.has(3,"数字键"));

      

    (6)entries方法  作用:返回实例的键值对遍历器。

    1
    2
    3
    4
    // 使用entries遍历
    for (let [key, value] of map.entries()) {
        console.log(key + " " + value)
    }

      

    (7)keys和values方法 

    keys()方法:返回实例所有键名的遍历器。
    values()方法:返回实例所有键值的遍历器.

    1
    2
    3
    4
    5
    6
    7
    8
    //遍历键名
    for (let key of map.keys()) {
        console.log(key);
    }
    //遍历值
    for (let value of map.values()) {
        console.log(value);
    }

      

    (8)forEach方法

    1
    map.forEach((value,key)=>{ console.log(key+":"+value)})

      

    (9)size方法

    size:获取实例的成员数

    Weak Map

    与Map不同点在于WeakMap结构的键名只支持引用类型的数据   比如:数组,对象,函数。

    1
    2
    3
    let weakmap = new WeakMap([[{name:"aaa"}]])
     
    console.log(weakmap)

      

    同样WeakMap也拥有get、has、delete方法,用法和用途都一样。不同地方在于,WeakMap不支持clear方法,不支持遍历,也就没有了keys、values、entries、forEach

    这4个方法,也没有属性size。

  • 相关阅读:
    mailto发送邮件
    使用css实现一个持续的动画效果
    documentFragment添加节点
    删除数组的第一个元素,不要直接修改数组,结果返回新的数组
    js数组去重
    css定位position(侧边栏导航)
    mongoexport导出mongodb数据库中的数据
    textarea头部不顶行问题和textarea禁止拉伸
    HTML meta标签
    textarea
  • 原文地址:https://www.cnblogs.com/chengxiao35/p/13610823.html
Copyright © 2011-2022 走看看