9.新增类型Map

本文详细介绍了JavaScript中的Map数据结构,包括其特性、创建方式、操作方法以及与Object、JSON之间的转换。Map允许使用各种类型的键,保证键的唯一性,特别强调了对象和数组作为键时的指针问题。同时,文章提供了Map到Object以及JSON的转换函数示例,帮助读者更好地理解和运用Map。
摘要由CSDN通过智能技术生成
1. Map简介

Map结构类似对象即键值对的集合,但是键不光可以是String型,还可以是其他类型。对于Object结构来说是"属性-值",对于Map结构来说是"键-值"Set之于Array,Map之于Object,Set能保证Array的value唯一,Map能保证Object的key唯一

const m = new Map()
const person = {name:'jack'}

m.set(person,'student')  // person作为m里的一个键,值对应为'student'
m.get(person) // 'student'
m.size // 1
m.has(person) // true
m.delete(person) // 你猜~

new的同时,添加键值对,传入双数组

const map = new Map([
  ['name','jack'],
  ['id',107]
])
// 结构如下
Map(2){
  [[Entries]]:[
	{key:'name',value:'jack'},
	{key:'id',value:107},
  ],
  size:2
}

// 实际执行算法:
const map = new Map()
[['name','jack'], ['id',107]].forEach(([key, value]) => map.set(key, value))  // 我又帮你复习了一次函数传参解构

实际上,每个定义了[Symbol.iterator],且每个项都是双元素的数组的数据结构都可以作为Map构造函数的参数

const s = new Set([
  ['name','jack'],
  ['id',107]
])
const map = new Map(s)
map.get('name') // jack

当键是object类型时要注意指针问题,这是一个大坑

const{log} =console // 还记得对象的解构吗?

const obj1 = {
  id: 107
}
const arr1 = [1, 2, 3]
const arr2 = [1, 2, 3]

const map = new Map([
  [obj1, 'person1'],
  [arr1, 'array1'],
  [arr2, 'array2']
])
// 引用类型作为键值时,保存的实际是指针
log(map.get({id:107})) // undefined
log(map.get([1,2,3])) // undefined

log(map.get(obj1)) // person1
log(map.get(arr1)) // array1
log(map.get(arr2)) // array2

遍历操作

for (let key of map.keys()) {
  log(key); // {id:107}、[1,2,3]、[1,2,3]
}
for (let value of map.values()) {
  log(value) // person1、array1、array2
}
for(let entry of map.entries()){
  log(entry) // [{id:107}, 'person1']、[[1,2,3], 'array1']、[[1,2,3], 'array2']
}

// 嘿嘿~ 还记得数组解构吗?
for (let [key, value] of map.entries()) {
  log(key, value)
}
for (let [key, value] of map) {
  log(key, value)
}
2. Map与Object的转换
function objectFromMap(map){
  let obj = Object.create(null)
  for(let [key,value] of map){
    obj[key] = value
  }
  return obj // 又帮你回忆工厂模式了
}

function mapFromObject(obj){
  let map = new Map()
  for(let property of obj){
    map.set(property, obj[property])
  }
  return map // 又又帮你回忆工厂模式了
}
3. Map与JSON的转换
// 情况1:当Map键值都是字符串时,可以直接转JSON对象
function jsonFromStrMap(strMap) {
  return JSON.stringify(objectFromMap(strMap))
}
// 情况2:当Map键值含其他数据类型时,可以转为JSON数组
function arrJsonFromMap(map){
  return JSON.stringify([...map]) // 二维数组
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值