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. 把数据库中的null作为条件查询应该用is

    如select * from mbXX where tuijian is null 而不是select * from mbXX where tuijian=null

  2. clang: error: unable to execute command: Segmentation fault: 11

    我在Archive的时候出现了上面这个错误, 解决方法很简单: After huge trying I have disabled the Bitcode in Project's Target-&g ...

  3. JAVA-6-简单的模拟ATM使用

    public static void main(String[] args) { in = new Scanner(System.in); int count = 1; int pwd = 11111 ...

  4. 26.单片机中利用定时器中断,在主流程while(1){}中设置每隔精确时间计量

    { CountMilliseconds++;//只负责自加,加到最大又重新从0开始 } u16 setDelay(u16 t) { ); } u8 checkDelay (u16 t)//返回非零表示 ...

  5. MySQL查询优化处理

    查询的生命周期的下一步是将一个sql转化成一个执行计划,MySQL再依照这个执行计划和存储引擎进行交互.这包括多个子阶段:解析sql,预处理,优化sql执行计划.这个过程中任何错误(例如语法错误)都可 ...

  6. js获取上传的文件名

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  7. Axure矩形边框重合边框变成双倍宽度解决办法

    选中两个矩形,菜单栏选择项目——项目设置——边界对齐(选择中心边界沿形状的边缘或者内边界对齐.将外边界对齐改为内边界对齐),即可去掉重合效果

  8. webservice: Could not initialize Service NoSuchMethodException getPortClassMap()

    今天用apache-cxf-3.1.1的wsdl2java生成webservice文件,调用的时候出了问题 报错:Could not initialize Service NoSuchMethodEx ...

  9. html5 利用canvas实现简单的人物走动

    最近在学习html5,其中涉及到很关键的元素canvas-画布,在网上下载了一些游戏源代码,虽然能看懂,但是想单独地针对某个功能提取出来还是有难处的,于是乎自己又上网查找了一些例子,才将超级玛丽简单的 ...

  10. nginx_笔记分享_配置篇

    参考http://www.howtocn.org/nginx:directiveindexhttp://blog.s135.com/ nginx 配置文档为 nginx.conf 比如我的配置文档 / ...