Map数据结构简单的学习

什么是map数据结构?

  • 在js中,传统的Object中,hash的键值对,键只能为字符串,现在为了解决一些特殊的需求,在es6中加入了map数据结构,他可以接受各种类型的值作为hash的键

简单的用法

const a = new Map()
const b = ['a']
a.set(b,111)      // 设置一个键
a.get(b)      //111  获取值

a.has(b)     //true  查询是否含有
a.delete(b) //true  删除
a.has(b)     //true
  • Map的用法当然不会这有一些简单的,它可以直接接受一个数组为参数,事实上,不局限于数组,任何可遍历的对象甚至只要具有Interator接口的数据结构都是可以当作map的参数,当然需要每个成员需要是双元素的,因为我们是要生成一个个的键值对
const map = new Map([
        ['a', '兔子'],
        ['b', '小狗']
])
map.get('a')   //兔子
map.get('b')   //小狗
  • 上面代码的结果和我们预期的结果是一样的,不难想出他的运行结果基本如下
const items = [
        ['a', '兔子'],
        ['b', '小狗']
]
const map = new Map()
items.map(([key, value]) =>{
      map.set(key, value)
})

  • 当然如你预期的一样,如果你去获取一个位置的键,你将得到的会是undefined
a.get('asdf')    //undefined
  • 需要注意的是,只有对同一个对象的引用,map才会视为同一个键
const map = new Map()
map.set(['a'], 111)
map.get(['a'])    // undefined
  • 为什么会这样? 是因为['a'] 这个对象是在存放在堆内存中,两个['a']的内存地址是不同的,这样第二次get的时候和第一次设置的时候不是同一个地址,获取的时候就会为undefined

  • 如果你觉得上面的有些不是太懂的话,我们接着看下面来帮助你理解为什么两个['a']地址不相同

const map = new Map()
const a1 = ['a']
const a2 = ['a']

map.set(a1,111)
.set(a2,222)

map.get(a1)    //111
map.get(a2)    //222
  • 这样的话是不是容易理解了一些,a1和a2虽然值相同,但是指向的内存地址并不相同,和我们预期的一样,如下:
a1 === a2  //false

由上面就可以看出,map在设计的时候键是与内存地址绑定的,是不是同一个键是看内存地址是否相同,这样做到好处,是我们在扩展别人的库或者方法的时候不用担心用了已经存在的属性而冲突

内存地址

  • 先看下面
['a'] === ['a']    //false

const a1 = ['a']
const a2 = ['a']
a1 === a2     //false
  • 上面两种写法的是相同的,只是第二种把两个不同的内存地址赋值给了两个变量

  • 当然如果你想彻底搞懂内存地址到底是怎么会是的话,你就需要了解栈内存和堆内存,我们先简单的理解成,栈只存放简单的数据类型,如果需要存放对象的话,就把对象放进堆内存中,留了一个地址(门牌号)放进栈中,看下图帮助你简单快速的理解


    image

通过上图我们不难看出内存地址具体是怎么不同的。一些关于map数据结构更详细的文档,还请大家去看阮老师的es6文档。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,036评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,046评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,411评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,622评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,661评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,521评论 1 304
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,288评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,200评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,644评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,837评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,953评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,673评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,281评论 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,889评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,011评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,119评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,901评论 2 355

推荐阅读更多精彩内容