jiangmugit / js_desc

随便记录点东西
0 stars 0 forks source link

Set、Map、WeakSet、WeakMap #2

Open jiangmugit opened 5 years ago

jiangmugit commented 5 years ago
  1. Set: 本身就是一个构造方法,可以直接new一个set类型的对象,也可以在new的时候传一个数组进去,生成一个该数组去重后的set对象。Set类型有点类似于数组,区别于数组的是,他里面的元素是不能重复的 eg: let a = new Set() // Set类型的空对象{} let b = new Set([1,2,3,3,3]) // 值为数组去重后的set类型的对象{1,2,3} 原型方法:

    • [1 ] add:往set对象里面添加一个元素,并且返回Set对象本身,由于可以返回本身,所以支持链式调用 eg: let testSet = new Set() testSet.add(1) // testSet:{1} testSet.add(2).add(3) // testSet:{1,2,3}
    • [2 ] size: 返回元素个数,类似于数组的length eg:let size = testSet.size() // 3
    • [3 ] delete:删除一个元素,并返回一个布尔值,假如这个元素存在,那么删除成功返回true,假如元素不存在,返回false eg: testSet.delete(4) // false testSet.delete(3) // true
    • [4 ]has:判断一个元素是否存在 eg: testSet.has(3) // false testSet.has(2) // true
    • [5 ]clear:清除所有元素,没有返回值 eg: testSet.clear() // testSet:{}
  2. Map: 本身就是一个构造方法,可以直接new一个Map类型的对象,也可以在new的时候传一个键值对二维数组进去,生成一个Map对象,还可以直接传一个map对象进行克隆,克隆之后相互独立。Map类型有点类似于对象 Map与Object的区别:

    • [1 ] Object是无序的,Map遵循FIFO原则(first in first out),所以在遍历的时候,先存进去的值会先被遍历
    • [2 ] Map对象可以通过size去获取键值对的个数,而Object只能通过遍历去算
    • [3 ] Object的key只能是字符串或者是symbol类型,而Map的key值可以是任何值
    • [4 ] Object的取值可以用obj.abc,那么abc在当前找不到就会上原型去找,而Map对象取键值对的

    原型方法:

    • [1 ] set:添加一个键值对,并且返回Map对象本身,由于可以返回本身,所以支持链式调用 eg: let testMap = new Map() testMap.set(123,456) // testMap:{123=>456} testMap.set(2,852).set(3,741) // testSet:{123=>456,2=>852,3=>741}
    • [2 ]get:获取某个键的值,当键不存在返回undefined eg: testMap.get(2) // 852
    • [3 ] size: 返回元键值对数 eg:let size = testMap.size() // 3
    • [4 ] delete:删除一个键值对,并返回一个布尔值,假如这个键值对存在,那么删除成功返回true,假如元素不存在,返回false eg: testMap.delete(4) // false testMap.delete(3) // true
    • [5 ]has:判断某个键是否存在Map结构中,返回boolean eg: testMap.has(3) // false testMap.has(2) // true
    • [6 ]clear:清除Map结构所有的成员,没有返回值 eg: testMap.clear() // testMap:{}
  3. Set和Map的遍历:

    let arr = [1, 2 , 3]
    let map = new Map([[1, 'a'], [2, 'b'], [3, 'c']])
    let set = new Set(arr)
    • [1 ] keys():返回一个键名的遍历器 Set:键名是元素本身 Map:键名是键值对的键名
      
      for(let key of set.keys()){
      console.log(key)
      // 分别打印出1 2 3
      }

    for(let key of map.keys()){ console.log(key) // 分别打印出1 2 3 }

    - [2 ] values():返回一个键值的遍历器
    Set:**键值是元素本身**
    Map:键值是键值对的键值
    ```javascript
    for(let value of set.values()){
      console.log(value)
      // 分别打印出1 2 3
    }
    
    for(let value of map.values()){
      console.log(value)
      // 分别打印出a b c
    }
    • [3 ] entries():返回一个遍历器 Set:键和值是元素本身 [元素本身,元素本身] Map:键和值是键值对的键和值 [键,值] Array:键和值是元素的下标和元素的值 [下标,值]
      
      for(let [key,value] of set.entries()){
      console.log(key, value)
      // 分别打印出1 1    2 2   3 3
      }

    for(let [key,value] of map.entries()){ console.log(key, value) // 分别打印出 1 a 2 b 3 c } for(let [key,value] of arr.entries()){ console.log(key, value) // 分别打印出 0 1 1 2 2 3 }

    - [4 ] forEach
    ```javascript
    set.forEach( item => {
      console.log(item)
      // 分别打印出1      2    3
    })
    
    map.forEach( (key,value) => {
      console.log(key, value)
      // 分别打印出  1 a     2  b      3  c
    })

4.进阶版:weakSet 和 weakMap 他们和Set Map很像,但是区别在于 weakSet只能存对象,weakMap的key只能是对象

以下涉及到内存泄漏及垃圾回收机制可不看: