Map is really useful when you want to use object as a key to set vaule, in ES5, you cannot really use object as a key:

var user1 = {
name: "Wan",
age: 25
}; var user2 = {
name: "Zhen",
age: 27
}; var users = {}; users[user1] = 5;
users[user2] = 10; console.log(users); /**
[object Object] {
[object Object]: 10
}
**/

As you can see, the output is always 10. It means the last value will overwrite the previous value.

The reason for that is because in Javascript, when you use Array syntax to assign value, the 'key' is always 'string'.

So if you use object 'user1', Javascript engine actually read it as

"[object Object]"

In other words, no matter what object you give, the 'users' array has only one value:

console.log(Object.keys(users));  // ["[object Object]"] 

-------------------------------------------------

Map in ES6 can help to solve the problem:

var user1 = {
name: "Wan",
age: 25
}; var user2 = {
name: "Zhen",
age: 27
}; var users = new Map(); users.set(user1, 5);
users.set(user2, 10); console.log(users.get(user1)); //
console.log(users.get(user2)); //

[ES6] Objects vs Maps的更多相关文章

  1. [ES6] Objects create-shorthand && Destructuring

    Creating Object: Example 1: let name = "Brook"; let totalReplies = 249; let avatar = " ...

  2. Customize Spring @RequestParam Deserialization for Maps and/or Nested Objects

    @RestController class MyController { @RequestMapping(...) public void test(Container container) { .. ...

  3. JavaScript中如何判断两变量是否“相等”?

    1 为什么要判断? 可能有些同学看到这个标题就会产生疑惑,为什么我们要判断JavaScript中的两个变量是否相等,JavaScript不是已经提供了双等号“==”以及三等号“===”给我们使用了吗? ...

  4. 大家都能看得懂的源码 - ahooks useSet 和 useMap

    本文是深入浅出 ahooks 源码系列文章的第十篇,该系列已整理成文档-地址.觉得还不错,给个 star 支持一下哈,Thanks. 今天我们来聊聊 ahooks 中对 Map 和 Set 类型进行状 ...

  5. JS数据结构之 Map

    JS数据结构之 Map Map介绍 Map(映射)是ES6引入的一种数据结构.这是一种存储键值对列表很方便的方法,类似于其他编程语言的哈希表. HashMap(哈希表),也叫做散列表.是根据关键码值 ...

  6. JavaScript简易教程(转)

    原文:http://www.cnblogs.com/yanhaijing/p/3685304.html 这是我所知道的最完整最简洁的JavaScript基础教程. 这篇文章带你尽快走进JavaScri ...

  7. 大规模视觉识别挑战赛ILSVRC2015各团队结果和方法 Large Scale Visual Recognition Challenge 2015

    Large Scale Visual Recognition Challenge 2015 (ILSVRC2015) Legend: Yellow background = winner in thi ...

  8. jsp 是什么 ,jsp 隐式对象

    google 搜索 java server page http://www.oracle.com/technetwork/java/javaee/jsp/index.html http://docs. ...

  9. JavaScript简易教程

    这是我所知道的最完整最简洁的JavaScript基础教程. 这篇文章带你尽快走进JavaScript的世界——前提是你有一些编程经验的话.本文试图描述这门语言的最小子集.我给这个子集起名叫做“Java ...

随机推荐

  1. maven第四章背景案例

    4.3简要设计 4.3.1接口设计 4.3.2模块结构 思想 先定义出核心接口,一个接口可以认为是一个功能,根据接口划分功能 设计模式就是一种思想,外观模式和代理模式,适配者模式三者的区别 http: ...

  2. android 检查网络是否可用,如果不可用弹出设置,让用户改变

    /** * 校验网络,如果没有网络,返回true * * @return boolean */ @Override public boolean hasInternetConnected() { Co ...

  3. ASP.NET执行cmd命令

    批处理命令,是执行速度最快效益最高的命令.因为批处理命令,说白了,就是ms-dos环境下的命令,有很多的批处理命令,都是纯DOS下的命令. 然而,批处理命令尽管功能强大,却存在不足之处.批处理命令只能 ...

  4. Box model小心得

    最近在研究css~当设置一个元素width后~有时候也会对他设定padding,margin,border值, 每次这样我就心里琢磨,那这个元素的width会变吗,js获取元素的宽度width()指的 ...

  5. 【Ecstore2.0】导出问题解决(未导出或导出文件为0字节)

    如果导出队列能成功执行(队列不执行看这里)但是并未生成文件,那么原因大部份可能是出在FTP上. ECSTORE2.0采用了PHP的FTP模块,所以先确认你的环境是否安装了FTP模块,如果没有,安装并在 ...

  6. phpcms v9二次开发之模型类的应用(2)

    二.模型操作方法select()--查询语句         //查询级别管理列表信息    public function levellists() { $lelists = $this->l ...

  7. 【持久化框架】Mybatis与Hibernate的详细对比

        前言 这篇博文我们重点分析一下Mybatis与hibernate的区别,当然在前面的博文中我们已经深入的研究了Mybatis和Hibernate的原理. Mybatis [持久化框架]Myba ...

  8. iOS摄像头和相册-UIImagePickerController-浅析(转)

    iOS摄像头和相册-UIImagePickerController-浅析(转) 转自: http://blog.sina.com.cn/s/blog_7b9d64af0101cfd9.html 在一些 ...

  9. Go http.HandlerFunc()

    //http.Handler type Handler interface { ServeHTTP(ResponseWriter, *Request) } type HandlerFunc func( ...

  10. CSS5.4 安装问题集

    由于手痒,将5.2 卸载了,装了5.4 出现如下错误:install failed to install com.ti.ccstudio.debugserver.win32 corrctly. ... ...