美文网首页
ES6中WeakSet与WeakMap的区别

ES6中WeakSet与WeakMap的区别

作者: 小碗碗碗碗 | 来源:发表于2020-05-26 22:40 被阅读0次

    在之前的文章,提到了Map与Set的区别。所以在本篇文章中,将谈下WeakSet与WeakMap的区别,并且将这4个一起做个比对。

    一、WeakSet

    WeakSet 对象允许将弱引用对象储存在一个集合中。什么是弱引用对象?就是:垃圾回收机制不考虑对该对象的引用,也就是说,如果其他对象都不再引用该对象,那么垃圾回收机制会自动回收该对象所占用的内存,不考虑该对象是否还在该弱引用的结构中。要注意的是,弱引用的对象不可遍历

    WeakSet具有以下方法:
    add(value): 在 WeakSet 对象中添加一个元素value
    has(value): 判断WeakSet 对象中是否包含value
    delete(value): 删除元素value

    let ws = new WeakSet()
    let obj = {}
    let foo = {}
    
    ws.add(window)
    ws.add(obj)
    
    ws.has(window)      // true
    ws.has(obj)         // true
    ws.has(foo)         // false
    
    ws.delete(window)   // true
    ws.delete(window)   // false
    

    WeakSet 与 Set 的区别:
    1、WeakSet 只能储存对象引用,不能存放值,而 Set 对象都可以。
    2、WeakSet 对象中储存的对象值都是被弱引用的,则这个对象将会被垃圾回收掉(不考虑该对象还存放于 WeakSet 中),所以 WeakSet 对象里有多少个成员元素,取决于垃圾回收机制有没有运行,运行前后成员个数可能不一致,遍历结束之后,有的成员可能被垃圾回收了。
    3、WeakSet 对象是无法被遍历的(ES6 规定 WeakSet 不可遍历),也没有办法拿到它包含的所有元素。

    二、WeakMap

    WeakMap 对象是一组键值对的集合,其中的键是弱引用对象,而值可以是任意。
    WeakMap 中,每个键对自己所引用对象的引用都是弱引用,在没有其他引用和该键引用同一对象,这个对象将会被垃圾回收(相应的key则变成无效的),所以,WeakMap 的 key 是不可枚举的

    注:WeakMap 弱引用的只是键名,而不是键值。键值依然是正常引用。

    WeakMap具有以下方法:
    has(key):判断是否有 key 关联对象
    get(key):返回key关联对象(没有则则返回 undefined)
    set(key):设置一组key关联对象
    delete(key):移除 key 的关联对象

    let myElement = document.getElementById('logo');
    let myWeakmap = new WeakMap();
    
    myWeakmap.set(myElement, {timesClicked: 0});
    
    myElement.addEventListener('click', function() {
      let logoData = myWeakmap.get(myElement);
      logoData.timesClicked++;
    }, false);
    

    三、Set、Map、WeakSet和WeakMap的区别总结

    1、Set
    成员唯一、无序且不重复;
    [value, value],键值与键名是一致的(或者说只有键值,没有键名);
    可以遍历,方法有:add、delete、has;
    2、WeakSet
    成员都是对象;
    成员都是弱引用,可以被垃圾回收机制回收,可以用来保存DOM节点,不容易造成内存泄漏;
    不能遍历,方法有add、delete、has;
    3、Map
    本质上是键值对的集合,类似集合;
    可以遍历,方法很多可以跟各种数据格式转换;
    4、WeakMap
    只接受对象作为键名(null除外),不接受其他类型的值作为键名;
    键名是弱引用,键值可以是任意的,键名所指向的对象可以被垃圾回收,此时键名是无效的;
    不能遍历,方法有get、set、has、delete;

    需要查看Map与Set的区别,见上一篇文章。:)

    相关文章

      网友评论

          本文标题:ES6中WeakSet与WeakMap的区别

          本文链接:https://www.haomeiwen.com/subject/ulpbahtx.html