ES6 Map vs ES5 Object

Map vs Object

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#Objects_vs._Maps

Maps 和 Objects 的区别

  1. 键类型不同,一个 Object 的键只能是字符串或者 Symbols,但一个 Map 的键可以是任意值;

  2. 键顺序不同,Map 中的键值是有序的(FIFO 原则),而添加到对象中的键则不是;

  3. 键长度获取方式不同,Map 的键值对个数可以从 size 属性获取,而 Object 的键值对个数只能手动计算;

  4. 键值读写方式不同,Object 通过key字符串下标或key, Map 使用 get, set

  5. 是否存在键名冲突不同, Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突;

  6. 遍历方式不同,Object 支持 for ...in, for ...of , Map 支持 for ...of

  7. 性能差异,

Map

Map 对象保存键值对;

任何值(对象或者原始值) 都可以作为一个键或一个值;

const map = new Map();
// undefined map.set(`a`, 1);
// Map(1) {"a" => 1}
map.set(`c`, 3);
// Map(2) {"a" => 1, "c" => 3}
map.set(`b`, 2);
// Map(3) {"a" => 1, "c" => 3, "b" => 2}
map;
// Map(3) {"a" => 1, "c" => 3, "b" => 2} map[0];
// undefined
map["a"];
// undefined
map.get("a"); // 1
map.size;
// 3
map.length;
// undefined // set to array, [...set]
// ??? map to object, {...map} ??? not work at all Object.keys(map).length;
// 0
let obj = {...map};
// undefined
obj;
// {}

Object


const obj = {};
// undefined
obj.a = 1;
// 1
obj.c = 3;
// 3
obj.b = 2;
// 2
obj;
// {a: 1, c: 3, b: 2}
obj[0];
// undefined
obj["a"];
// 1
obj.a;
// 1 obj.length;
// undefined
Object.keys(obj).length;
// 3

Map 转换成 Object


Set 转换成 Array

https://www.cnblogs.com/xgqfrms/p/13757290.html

const set = new Set();
set.add(1) const arr = [...set];

same Value Zero algorithm

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#Same-value-zero_equality


refs

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object

https://www.runoob.com/w3cnote/es6-map-set.html



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


ES6 Map vs ES5 Object的更多相关文章

  1. ES6 - Map

    含义和基本用法   Map对象就是简单的键值对映射.其中的键和值可以使任意值.(ps : 对象的键只能是字符串 ) JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构) ...

  2. ES6 Set vs ES5 Array

    ES6 Set vs ES5 Array Set https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Ob ...

  3. js es6 map 与 原生对象区别

    区别 object和Map存储的都是键值对组合.但是: object的键的类型是 字符串: map的键的类型是 可以是任意类型: 另外注意,object获取键值使用Object.keys(返回数组): ...

  4. ES6 Map All In One

    ES6 Map All In One Map 字典/地图 Set 集合 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Referenc ...

  5. ES6学习(1)——如何通过babel将ES6转化成ES5

    使用babel编译ES6 babel是一个工具,可以通过多个平台,让js文件从ES6转化成ES5,从而支持一些浏览器并未支持的语法. Insall babel $ sudo npm install b ...

  6. es6开发环境搭建,babel 将es6转化成es5

    工欲善其事,必先利其器.所以我们第1节就是搭建一个基本的ES6开发环境.现在的Chrome浏览器已经支持ES6了,但是有些低版本的浏览器还是不支持ES6的语法,这就需要我们把ES6的语法自动的转变成E ...

  7. ES6 & Map & hashMap

    ES6 & Map & hashMap 01 two-sum https://leetcode.com/submissions/detail/141732589/ hashMap ht ...

  8. 使用babel将ES6编译成ES5

    现在ES6已经非常成熟了,我的需求很明确,就是只需要将ES6编译成ES5. 项目目录为 借鉴的博客链接为https://blog.csdn.net/suwu150/article/details/77 ...

  9. es6 javascript对象方法Object.assign()

    es6 javascript对象方法Object.assign() 2016年12月01日 16:42:34 阅读数:38583 1  基本用法 Object.assign方法用于对象的合并,将源对象 ...

随机推荐

  1. 3.kafka安装配置

    kafka安装配置 ### 1.集群规划 hadoop102 hadoop103 hadoop104 zk zk zk kafka kafka kafka jar包下载 http://kafka.ap ...

  2. (Oracle)导出表结构

    DECLARE cursor t_name is SELECT rank() over(order by a.TABLE_NAME) as xiaolonglong,a.TABLE_NAME FROM ...

  3. JVM笔记 -- Java跨平台和JVM跨语言

    学习JVM的重要性 从上层应用程序到底层操作系统,到底有哪些东西? 平时开发的应用程序主要基于各种框架,譬如Spring,SpringMVC,Mybatis,而各种框架又是基于Java API来实现的 ...

  4. sql多行合并

    例一 SELECT qqo.questionID '题目id', qqo.quesOption '选项' FROM qz_question_option qqo, qz_question qq WHE ...

  5. 浅谈正向代理、反向代理和CDN的区别

    一.正向代理 1.正向代理位于客户端和源服务器之间的服务器(代理服务器): 2.隐藏客户端:由代理服务器代替客户端去访问目标服务器,用户需要设置代理服务器的IP和端口: 3.每一次请求是到代理服务器, ...

  6. Vue3.0短视频+直播|vue3+vite2+vant3仿抖音界面|vue3.x小视频实例

    基于vue3.0构建移动端仿抖音/快手短视频+直播实战项目Vue3-DouYin. 5G时代已来,短视频也越来越成为新一代年轻人的娱乐方式,在这个特殊之年,又将再一次成为新年俗! 基于vue3.x+v ...

  7. Java——I/O操作之拷贝文件

    功能描述: 利用文件输入输出流编写一个实现文件拷贝的程序,源文件名和目标文件名通过控制台输入. public static void main(String[] args) { Scanner in= ...

  8. GeoMesa命令行,索引概述

    GeoMesa 一.GeoMesa命令行 查看classpath 创建表 描述表 批量导入数据 解释查询 统计分析 导出feature 删除feature 获取目录中的全部表的名称 删除表 删除目录 ...

  9. 使用Docker Compose编排Spring Cloud微服务

    文章目录 微服务构建实例 简化Compose的编写 编排高可用的Eureka Server 编排高可用Spring Cloud微服务集群及动态伸缩 微服务项目名称 项目微服务中的角色 microser ...

  10. hbase远程api调用, 远程连接开发,环境构建相关问题总结

    平时在开发的过程中,都是将hbase的环境装在虚拟机或者双系统上的,开发是直接在unix或者linux上进行的,这样对于使用上,有些繁琐. 下面我将介绍我在使用windows远程开发过程中的一些总结: ...