ES6 - Map

sugarmo 发布于2019-08-26 10:27 / 1732人阅读

摘要：和是新增的种集合类型，在前面已经讲过。对应的不会对方法的结果产生影响。方法的第一个参数也就是一个接受，，本身这三个参数。会按照键值对的插入顺序轮询得到打印结果以上，就是的一些基本特性和使用场景，下一篇我们讲。

Set和Map是ES6新增的2种集合类型，Set在前面已经讲过。这一篇我们主要来讲一下Map。我们先来看一些Map的基本定义和描述：

1: Map是一种存储着多个键值对的有序列表
2: Map的元素的key和value可以是任何数据类型
3: 键名的等值性通过Object.is()判断，所以数字5和字符串"5"是两个独立的key

废话不多说，我们来看看Map的基本用法：
一：创建和初始化一个Map
1：创建一个空Map

let map = new Map();

以上，我们创建了一个没有元素的空Map。
2：用Array初始化Map

let map = new Map([["name", "mike"],["age", 25]]);
map.forEach(function (value, key, map) {
    console.log(`${key}: ${value}`)
})

得到打印结果：

name: mike
age: 25

用Array初始化Map，需要一个二维数组，二维数组里面的每一个元素（也就是一个一维数组）包含2个元素，第一个元素是键值对的key，第二个元素是键值对的value。

二：Map的增
在上面的内容里，我们说到通过调用new Map()创建了一个空Map。那如果我们想要往这个map里存储数据，可以调用set(key, value)来完成：

let map = new Map();
map.set("name", "mike");
map.set("age", 25);
map.forEach(function (value, key, map) {
    console.log(`${key}: ${value}`)
})

以上的打印得到：

name: mike
age: 25

set()方法，第一个参数为key，第二个参数为value。

三：Map的删
跟Set一样，我们也可以通过调用clear()方法来删除整个map里面的元素：

let map = new Map([["name", "mike"],["age", 25]]);
map.clear();
console.log(map.size); // 0

四：Map的查
1: 我们可以通过has()方法来查看在map里是否存在某个键名

let map = new Map([["name", ""],["age", 0]]);
console.log(map.has("name")); //true
console.log(map.has("age"));//true
console.log(map.has("country"));//false

需要特别注意的是，has()方法只检查某个key是否存在，存在就返回true，不存在就返回false。key对应的value不会对has()方法的结果产生影响。

2: 我们可以通过get()方法来获取某个key对应的value

let map = new Map([["name", "mike"],["age", 25]]);
console.log(map.get("name")); // mike
console.log(map.get("age")); // 25
console.log(map.get("country")); // undefined

如果获取某个不存在的key，此方法返回undefined。

五：Map的减
与Set一样，我们可以调用delete(key)删除一个键值对：

let map = new Map([["name", "mike"], ["age", 25]]);
map.delete("name");
console.log(map.size); // 1

六：Map的forEach()方法
Map当然也有forEach()方法，我们在前面的例子其实已经使用过了。forEach()方法的第一个参数（也就是一个function）接受value，key，map本身这三个参数。forEach()会按照键值对的插入顺序轮询：

let map = new Map();
map.set(2, "lily");
map.set("name", "dan");
map.set(1, "mike");
map.forEach(function (value, key, mapSelf) {
    console.log(`${key}: ${value}`);
})

得到打印结果：

2: lily
name: dan
1: mike

以上，就是Map的一些基本特性和使用场景，下一篇我们讲WeakMap。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/106194.html

ES6引入的数据结构 - ES6 - ECMAScript特性 - Javascript核心

摘要：引入的数据结构新加入的数据类型有这些数据结构的支持并不广泛，在写这篇文章的时候。是或其他可枚举的对象，其每个元素是的元数组。开头的和不对持有引用，不影响。因此，他们没有办法对自身的进行直接的枚举。目前新版的和支持。原文：http://pij.robinqu.me/JavaScript_Core/ECMAScript/es6/es6_data_types.html 源代...

fobnn 2019-08-19 14:50 评论0 收藏0
深入理解：ES6中的Set和Map数据结构，Map与其它数据结构的互相转换

摘要：学习笔记工作中常用到的语法只是简单提及和，今天有空于是写了这篇文章深入理解中的和数据结构，与其它数据结构的互相转换。的提供了新的数据结构。本身是一个构造函数，用来生成数据结构。文中的内容主要是来自于阮一峰的《ES6标准入门》（第三版）。《学习ES6笔记──工作中常用到的ES6语法》只是简单提及Set和Map，今天有空于是写了这篇文章──《深入理解：ES6中的Set和Map数据结构，M...

Cristalven 2019-08-23 12:00 评论0 收藏0
深入理解ES6笔记（七）Set集合和Map集合

摘要：创建并添加项目可以使用数组来初始化一个，并且构造器会确保不重复地使用这些值使用方法来测试某个值是否存在于中移除值使用方法来移除单个值，或调用方法来将所有值从中移除。属性的初始化将数组传递给构造器，以便使用数据来初始化一个。主要知识点：Set的基本操作，Weak Set，Map的基本操作，Weak MapshowImg(https://segmentfault.com/img/bVbf...

loostudy 2019-08-23 11:26 评论0 收藏0
学习ES6笔记──工作中常用到的ES6语法

摘要：但是有了尾调用优化之后，递归函数的性能有了提升。常被用来检查对象中是否存在某个键名，集合常被用来获取已存的信息。循环解构对象本身不支持迭代，但是我们可以自己添加一个生成器，返回一个，的迭代器，然后使用循环解构和。一、let和const 在JavaScript中咱们以前主要用关键var来定义变量，ES6之后，新增了定义变量的两个关键字，分别是let和const。对于变量来说，在ES5中...

curried 2019-08-26 12:16 评论0 收藏0
由codewars上的一道题目学习ES6的Map

摘要：我对数据结构的学习最近在上做了一道题目，嗯，我这个渣渣没有做出来，然后看了别人的解决方案，是时候学习一下的了。。。。。读取对应的键值，如果找不到返回键是函数返回一个布尔值，表示某个键是否在数据结构中。我对ES6数据结构Map的学习最近在CodeWars上做了一道题目，嗯，我这个渣渣没有做出来，然后看了别人的解决方案，Map？？？是时候学习一下ES6的Map了。。。。。以下是原题...

IamDLY 2019-08-21 15:29 评论0 收藏0
ES6中 Map 数据结构

摘要：新增了数据结构，对象保存键值对，任何值原始值或对象都可以作为一个键或一个值。基本用法实例的属性和操作方法方法设置键名对应的键值为，然后返回整个结构。获取的值方法返回一个布尔值，表示某个键是否在当前对象之中。如果删除失败，返回。 ES6新增了 Map数据结构，Map对象保存键值对，任何值（原始值或对象）都可以作为一个键或一个值。基本用法 let map = new Map(); let...

hlcfan 2019-08-23 12:11 评论0 收藏0