文章目录

  • Map
    • 1 Map介绍
    • 2 创建一个Map
    • 3 常用方法介绍
    • 4 将Map转换为数组
    • 5 从数组构建Map
    • 6 遍历Map

Map

1 Map介绍

  • Map用来存储键值对结构的数据**(key-value)**
  • Object中存储的数据就可以认为是一种键值对结构
  • Map和Object的主要区别:
    • Object中的属性名只能是字符串或符号,如果传递了一个其他类型的属性名,JS解释器会自动将其转换为字符串
    • Map中任何类型的值都可以成为数据的key
const obj = {
    "name":"孙悟空",
    'age':18,
    [Symbol()]:"哈哈",
    [obj2]:"嘻嘻"
}

JavaScript -- Map对象及常用方法介绍

2 创建一个Map

const map = new Map()
map.set("name", "孙悟空")
map.set(obj2, "呵呵")
map.set(NaN, "哈哈哈")
map.delete(NaN)
// map.clear()
console.log(map)
console.log(map.get("name"))
console.log(map.has("name"))

JavaScript -- Map对象及常用方法介绍

3 常用方法介绍

  • map.size() 获取map中键值对的数量
  • map.set(key, value) 向map中添加键值对
  • map.get(key) 根据key获取值
  • map.delete(key) 删除指定数据
  • map.has(key) 检查map中是否包含指定键
  • map.clear() 删除全部的键值对
  • map.keys() 获取map的所有的key
  • map.values() 获取map的所有的value

4 将Map转换为数组

方法一:使用方法Array.from(map)

const map = new Map()
map.set("name", "孙悟空")
map.set("age", 18)
map.set({}, "呵呵")
// 将map转换为数组
const arr = Array.from(map) // [["name","孙悟空"],["age",18]]
const arr = [...map]
console.log(arr)

JavaScript -- Map对象及常用方法介绍

方法二:使用解构符

推荐这种方法,写法更简便

const map = new Map()
map.set("name", "孙悟空")
map.set("age", 18)
map.set({}, "呵呵")
// 将map转换为数组
const arr = [...map]
console.log(arr)

JavaScript -- Map对象及常用方法介绍

5 从数组构建Map

const map2 = new Map([
    ["name", "猪八戒"],
    ["age", 18],
    [{}, () => {}],
])
console.log(map2)

JavaScript -- Map对象及常用方法介绍

6 遍历Map

方法一:使用for-of

const map = new Map()
map.set("name", "孙悟空")
map.set("age", 18)
map.set({}, "呵呵")
for (const [key, value] of map) {
    // const [key, value] = entry
    console.log(key, value)
}

方法二:使用forEach

const map = new Map()
map.set("name", "孙悟空")
map.set("age", 18)
map.set({}, "呵呵")
map.forEach((key, value)=>{
    console.log(key, value)
})
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。