学习笔记 JavaScript ES6 Map

学习内容：

• 常用方法
• 遍历
• 应用场景
• WeakMap

与Map对应的是对象，同为键值对形式。对象的key只能是字符串或Symbol()，Map的key可以为任何类型包括对象。

注意：Map添加值是用set，Set添加值是add

let m = new Map()
let obj = {
    name : 'Sure'
}
m.set(obj, 'Wang')

console.log(m)
console.log(m.get(obj))

-------------------------------
Map(1) {{…} => 'Wang'}
    [[Entries]]
        0: {Object => "Wang"}
    size: 1
    [[Prototype]]: Map
Wang

Map的一些api

let m = new Map()
let obj = {
    name : 'Sure'
}
m.set(obj, 'Wang')

console.log(m.has(obj))
m.delete(obj)
console.log(m)
-------------------------------
true
Map(0) {size: 0}

把数组作为map的参数的一些api

let m = new Map([
    ['name','Hello'],
    ['age', 5]
])

console.log(m)
console.log(m.size) // size
console.log(m.has('name')) // has
console.log(m.get('age')) // get
console.log(m.set('name','zhangsan'))
console.log(m.delete('name')) // delete
console.log(m)

-----------------------------------------
Map(2) {'name' => 'Hello', 'age' => 5}
2
true
5
Map(2) {'name' => 'zhangsan', 'age' => 5}
true
Map(1) {'age' => 5}

Map遍历

forEach()，注意第一个参数是value，第二个参数是key，和for of正好反过来

let map = new Map([
    ['name','Hello'],
    ['age', 5]
])

// 注意第一个参数是value，第二个参数是key
map.forEach((value,key) => console.log(value, key))

------------
Hello name
5 'age'

 for( of map)，这里需要注意，for of第一个参数是key，第二个参数是value，和forEach()正好反过来

let map = new Map([
    ['name','Hello'],
    ['age', 5]
])

// 注意第一个参数是key，第二个参数是value
for(let [key, value] of map) {
    console.log(key,value)
}
------------
name Hello
age 5

map.keys()、map.values()

let map = new Map([
    ['name','Hello'],
    ['age', 5]
])

for(let key of map.keys()) {
    console.log(key)
}

for(let value of map.values()) {
    console.log(value)
}

-------------
name
age
Hello
5

map.entries()

let map = new Map([
    ['name','Hello'],
    ['age', 5]
])

// 注意第一个参数是key，第二个参数是value
for(let [key, value] of map.entries()) {
    console.log(key,value)
}

------------
name Hello
age 5

应用场景 

可以使用Object的场景都可以使用map。

map可以直接通过has、get判断是否存在某属性并取出，而obj只能通过遍历取得属性。

map有很多api要比obj灵活，比如size，但obj判断有多少属性只能遍历。

有很多资料显示频繁增减键值对操作时，map的性能要高于obj，但是高多少还没有数据支持。

WeakMap

WeakMap的键名只引用数据类型，比如数组、对象、function等。

let wm = new WeakMap()
wm.set('key','value') // key非引用数据类型，报错

----------------------------------------------------------
Uncaught TypeError: Invalid value used as weak map key
    at WeakMap.set (<anonymous>)

使用引用类型作为key，不会报错 

let wm = new WeakMap()
wm.set([1],'value')
wm.set({
    k:'test'
})

console.log(wm)

----------------------------------------------------------
WeakMap {Array(1) => 'value', {…} => undefined}
    [[Entries]]
        0: {Array(1) => "value"}
        1: {Object => undefined}
[[Prototype]]: WeakMap

WeakMap不可以遍历，也没有size()，也是弱引用。