JS 数据类型 (02) - Map 和 Set 的区别 ?

87 阅读2分钟
  • Map是有有序列表,key可以是任意类型;Object是无序列表,key只能是两种类型(string和symbol类型)

    let map = new Map();
    map.set("A", 1);
    map.set("B", 2);
    map.set("C", 3);
    
    // Map中键值对的迭代顺序是保留的
    for (let [key, value] of map) {
      console.log(key, value);
    }
    // 输出:
    // A 1
    // B 2
    // C 3
    
  • Set 是集合,可以自动去重

  • Map 和 Set 比 Object Array 整体要执行更快

Map

它的键可以是任意类型,拥有的 Api 如下

  • size 属性
  • get() 
  • set()
  • has()
  • delete()
  • clear()

Set

类似于数组,但是成员的值是唯一的,没有重复的,我们一般称为集合

拥有的 API 如下

  • add()
  • delete()
  • has()
  • clear()

WeakMap

在API中WeakMap与Map有两个区别:

  • 没有遍历操作的API
  • 没有clear清空方法

WeakMap 只接受对象作为键名(null除外),不接受其他类型的值作为键名

const map = new WeakMap();
map.set(1, 2)
// TypeError: 1 is not an object!
map.set(Symbol(), 2)
// TypeError: Invalid value used as weak map key
map.set(null, 2)
// TypeError: Invalid value used as weak map key

WeakMap 的键名所指向的对象,一旦不再需要,里面的键名对象和对应的键值对会自动消除,不用手动删除引用

举个场景例子:

在网页的 DOM 元素上添加数据,就可以使用WeakMap结构,当该 DOM 元素被清除,其所对应的WeakMap记录就会自动被移除

const wm = new WeakMap();

const element = document.getElementById('example');

wm.set(element, 'some information');
wm.get(element) // "some information"

element.parentNode.removeChild(element)
element = null
wm.get(element) // undefined

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

下面代码中,键值obj会在WeakMap产生新的引用,当你修改obj不会影响到内部

const wm = new WeakMap();
let key = {};
let obj = {foo: 1};

wm.set(key, obj);
obj = null;
wm.get(key)
// Object {foo: 1}

WeakSet

在API中WeakSet与Set有两个区别:

  • 没有遍历操作的API
  • 没有size属性

WeakSet只能成员只能是引用类型,而不能是其他类型的值

let ws=new WeakSet();

// 成员不是引用类型
let weakSet=new WeakSet([2,3]);
console.log(weakSet) // 报错

// 成员为引用类型
let obj1={name:1}
let obj2={name:1}
let ws=new WeakSet([obj1,obj2]); 
console.log(ws) //WeakSet {{…}, {…}}

WeakSet里面的引用只要在外部消失,它在 WeakSet里面的引用就会自动消失

上一篇: JS 数据类型 (01)-有哪些?有什么区别?