结论

  • Map:存放键值对,区别于 Object,键可以是任何值。
  • Set:存放不重复的值

Map

存储键值对,读取时与插入顺序一致。

var map = new Map([[1, "1"], [3, "3"], [2, "2"]]);
map.set("foo", "bar"); for (const [key, val] of map) {

console.log(key, val);

}

输出:

1 '1'
3 '3'
2 '2'
foo bar

任何值,对象或原始值,都可作为 Map 的键。

var myMap = new Map();

var keyString = 'a string',

keyObj = {},

keyFunc = function() {}; // setting the values

myMap.set(keyString, "value associated with 'a string'");

myMap.set(keyObj, 'value associated with keyObj');

myMap.set(keyFunc, 'value associated with keyFunc'); myMap.size; // 3 // getting the values

myMap.get(keyString); // "value associated with 'a string'"

myMap.get(keyObj); // "value associated with keyObj"

myMap.get(keyFunc); // "value associated with keyFunc" myMap.get('a string'); // "value associated with 'a string'"

// because keyString === 'a string'

myMap.get({}); // undefined, because keyObj !== {}

myMap.get(function() {}); // undefined, because keyFunc !== function () {}

相比 Object,除了对可作为键的值没要求外,Map 自带遍历器(iterator),可对其使用 for of 语句。

同时还自带一些便捷的属性和方法,比如 sizeclear()

Set

存储唯一的值,对于重复的值会被忽略。

示例:

var obj = { a: 1, b: 2 };
var set = new Set([1, 2, 2, "foo"]);
set.add(obj);
set.add(obj); console.log("size:", set.size);

console.log(set.has(2));

console.log(set.has(obj)); for (const val of set) {

console.log(val);

}

输出:

4
true
true
1
2
foo
{ a: 1, b: 2 }

相关资源

JavaScript Map 和 Set的更多相关文章

  1. js javascript map函数去重功能的使用实例

    js javascript map函数去重功能的使用实例 先上一个实战例子代码 var map = new Map(); for(var i=0; i<=9; i++){ map.set(i,i ...

  2. 一个简单的JavaScript Map

    用js写了一个Map,带遍历功能,请大家点评下啦. //map.js Array.prototype.remove = function(s) { for (var i = 0; i < thi ...

  3. Arcgis for javascript map操作addLayer具体解释

    本节的内容非常easy.说说Arcgis for Javascript里面map对象的addLayer方法.在for JS的API中,addLayer方法有两种.例如以下图: watermark/2/ ...

  4. javascript Map和Set

    Map和Set JavaScript的默认对象表示方式{}可以视为其他语言中的Map或Dictionary的数据结构,即一组键值对. 但是JavaScript的对象有个小问题,就是键必须是字符串.但实 ...

  5. Arcgis for javascript map操作addLayer详解

    本节的内容很简单,说说Arcgis for Javascript里面map对象的addLayer方法.在for JS的API中,addLayer方法有两种,如下图: addLayer方法 在addLa ...

  6. JavaScript Map 和 Object 的区别

    不同点 Key filed 在 Object 中, key 必须是简单数据类型(整数,字符串或者是 symbol),而在 Map 中则可以是 JavaScript 支持的所有数据类型,也就是说可以用一 ...

  7. javascript map forEach filter some every在购物车中的实战演练区分用法

    1.map forEach 1.map 循环遍历每一项,返回一个新的数组 例: 购物车商品小计: //购物车 var cart=[ {"id":101,"name&quo ...

  8. JavaScript --- Map集合结构详解

    Map 对象保存键值对.任何值(对象或者原始值) 都可以作为一个键或一个值. 语法 new Map([iterable]) 参数 iterable Iterable 可以是一个数组或者其他 itera ...

  9. JavaScript Map 实现

    //定义map function Map() { this.container = {}; } //将key-value放入map中 Map.prototype.put = function(key, ...

随机推荐

  1. openstack Mitaka实验环境安装(centos系统)

    本博文仅供参考,具体一定详细学习官方安装文档. 一 准备工作 二安装过程 1 安装NTP服务 2 安装openstack包 3 SQL数据库安装 4 安装消息队列 message queue 5 Me ...

  2. C++与数据结构课程设计---定票咨询系统

    订票咨询管理系统 设计编制一个订票管理系统,考虑旅客不同的要求.例如,选择不同的交通工具,希望在旅途中的时间尽可能地短,期望旅费尽可能省,或要求中转次数最少等.为旅客提供两种或三种最优决策.车票基本信 ...

  3. 使用Spring Boot和AspectJ实现方法跟踪基础结构

    了解如何使用Spring Boot和AspectJ实现方法跟踪基础结构!最近在优锐课学习收获颇多,记录下来大家一起进步! 在我们的应用程序中,获取方法的堆栈跟踪信息可能会节省很多时间.具有输入输出参数 ...

  4. JS操作document对象

    找到对象: document.getElementById():返回对拥有指定 id 的第一个对象的引用. document.getElementsByName():返回带有指定名称的对象集合. do ...

  5. PyCharm配置Gitee

    PyCharm配置Gitee 第一步:下载安装Git https://git-scm.com/download/win 第二步:打开PyCharm,配置Git File->Setting-> ...

  6. python为前端提供API

    作为一名前端来学习后端语言,有难度啊.这里把第一次尝试的过程做个记录 1.网上看到Python给前端提供API可以使用python的flaskweb框架 #py文件 import json from ...

  7. screen虚拟终端工具

    说明:有时候我们要执行一个命令或脚本,需要几小时甚至几天,但是不能中断,有时想查看当前输出信息的时候,可以将它丢到后台运行,但是后台运行却无法显示或输出相关信息出来:我们可以使用一个虚拟终端工具scr ...

  8. Vue中使用keep-alive优化网页性能

    用keep-alive包裹路由 当前数据第一次访问时,会被缓存到浏览器缓存当中,若数据无更替,则直接读取缓存中的数据. 使用keep-alive时会存在一个activated的生命周期钩子 只有在la ...

  9. 业级PPTP服务器搭建企

    搭建企业级PPTP服务器   分类: Linux服务篇 undefined 本文收录在企业项目实战系列 一.VPN 介绍 1.介绍 虚拟私人网络(英语:Virtual Private Network, ...

  10. C语言每日一练——第6题

    一.题目要求 计算500~800区间素数的个数cnt,并按所求素数的值从大到小的顺序,计算其间隔间的减.加之和,即第1个素数-第2个素数+第3个素数-第4个素数+第5个素数.....的值sum.最后把 ...