JavaScript数据结构Set、Map学习

Set的基本使用（集合）

set类似于数组，但是set不能存放重复元素，set传入的参数是一个可迭代的对象

const set = new Set(可迭代的对象)

数组去重

const arr = [10, 20, 10, 30, 40, 20]
const set = new Set(arr) 
const newArr = Array.from(set) // Array.from(传入的也是一个可迭代对象)
const newArr2 = [...set]
// [10, 20, 30, 40]

add()

const set = new Set()
set.add(10)
set.add({})
set.add({})
// Set(3) {10, {}, {}} 相当于在堆内存中创建了不同的对象，保存的不同的对象地址

size()

const arr = [10, 20, 10, 30, 40, 20]
const set = new Set(arr)
set.size()
// 4

delete()

delete(元素) 需要传具体的元素

const arr = [10, 20, 10, 30, 40, 20]
const set = new Set(arr)
set.delete(10)

has()

has(元素) 是否包含某个元素，返回值为 true/false

const arr = [10, 20, 10, 30, 40, 20]
const set = new Set(arr)
set.has(10)
// true

clear()

clear() 清除所有的元素

set本身支持for、forEach、for…of 进行遍历

WeakSet

类似于Set的数据结构

区别:

WeakSet中只能存放对象类型，不能存放基础数据类型
WeakSet对元素的引用是弱引用，如果没有其它引用对某个对象进行引用，那么GC可以对该对象进行回收

let obj = {}
const ser = new Set()
set.add(obj) // Set()建立的引用是强引用
const weakSet = new WeakSet()
weakSet.add(obj) // WeakSet()建立的引用是弱引用

WeakSet() 具备这下面三个方法与Set相同

add()、delete()、has()

扫描二维码关注公众号，回复： 14647191 查看本文章

但是WeakSet() 不具备 clear()、size() 等方法

注意WeakSet() 不能遍历

因为WeakSet只是对对象的弱引用，如果我们遍历获取到其中的元素，那么有可能造成对象不能正常的销毁。

所以存储到WeakSet中的对象是没办法获取的；

验证WeakSet弱引用

let obj = { name: 'mjy', age: 18 }

let info  = new WeakSet()
info.add(obj)

const finalRegistry = new FinalizationRegistry((value) => {
    console.log('对象被销毁了', value)
})
finalRegistry.register(obj, "obj")
obj = null

或是通过WeakRef来建立的弱引用

let obj = { name: 'mjy', age: 18 }

let info  = new WeakRef(obj)

const finalRegistry = new FinalizationRegistry((value) => {
    console.log('对象被销毁了', value)
})

console.log(info.deref())
finalRegistry.register(obj, "obj")
obj = null

Map的基本使用

Map，用于储存映射关系。

为什么需要用Map来存储映射关系呢，我们也可以使用对象来存储映射关系，他们有什么区别呢？

Object对象的key值只能是字符串，即便你传入的值不是字符串，比如对象，这个时候也会自动将对象转换成字符串来作为key

const obj1 = {name: "why"}
const obj2 = {name: "mjy"}

const info = {
  [obj1]: "aaaa",
  [obj2]: "bbbb"
}

consle.log(info) // {'[object Object]': 'bbb'}

Map允许我们的其他类型作为key

const obj1 = {name: "why"}
const obj2 = {name: "mjy"}

const map = new Map()
map.set(obj1, "aaa")
map.set(obj2, "bbb")
map.set(1, "ccc")
// Map(2) { 
  {name: "why"} => "aaa",
  {name: "mjy"} => "bbb",
  1 => "ccc" 
}

也可以这么创建Map，和上面效果是一样的

const obj1 = {name: "why"}
const obj2 = {name: "mjy"}

const map2 = new Map([[obj1, "aaa"], [obj2, "bbb"], [1, "ccc"]])
// Map(2) { 
  {name: "why"} => "aaa", 
  {name: "mjy"} => "bbb", 
  1 => "ccc"
}

get()

get(key) 传入key值获取value

const map = new Map()
map.set(111, "mjy")
map.get(111)
// mjy

has()

has(key) 返回是否存在该key值，true/false

delete()

delete(key) 删除某个key，删除成功返回true，不成功false

clear()

clear() 清空整个Map

Map 直接forEach、for…of

WeakMap

与Map类型相似的另外一个数据结构，也是以键值对的形式存在的。

WeakMap的key只能使用对象，不接受其他类型的key；

WeakMap的key对对象的引用是弱引用，如果没有引用这个对象，那么GC也可以回收该对象；

WeakMap()本身不支持遍历；

WeakMap支持以下Map操作方法：set()、get()、has()、delete()