当前位置:首页 > 日记 > 正文

ES6学习教程之Map的常用方法总结

ES6学习教程之Map的常用方法总结

前言

ES6包含了许多新的语言特性,这会让JS变的更加强大且富有表现力。本文将给大家详细介绍关于ES6中Map的常用方法,话不多说,来一起看看详细的介绍:

1.Map 结构转为数组结构

比较快速的方法是结合使用扩展运算符(...)

let map = new Map([ [1, 'one'], [2, 'two'], [3, 'three'],]);[...map.keys()]// [1, 2, 3][...map.values()]// ['one', 'two', 'three'][...map.entries()]// [[1,'one'], [2, 'two'], [3, 'three']][...map]// [[1,'one'], [2, 'two'], [3, 'three']]

2.Map 循环遍历

Map 原生提供三个遍历器:

  • keys():返回键名的遍历器。
  • values():返回键值的遍历器。
  • entries():返回所有成员的遍历器。

下面是使用实例。

let map = new Map([ ['F', 'no'], ['T', 'yes'],]);for (let key of map.keys()) { console.log(key);}// "F"// "T"for (let value of map.values()) { console.log(value);}// "no"// "yes"for (let item of map.entries()) { console.log(item[0], item[1]);}// "F" "no"// "T" "yes"// 或者for (let [key, value] of map.entries()) { console.log(key, value);}// 等同于使用map.entries()for (let [key, value] of map) { console.log(key, value);}

上面代码最后的那个例子,表示 Map 结构的默认遍历器接口(Symbol.iterator 属性),就是 entries 方法。

map[Symbol.iterator] === map.entries // true

3.Map 获取长度

map.size;

4.Map 获取第一个元素

const m = new Map();m.set('key1', {})m.set('keyN', {})console.log(m.entries().next().value); // [ 'key1', {} ]

获取第一个key

console.log(m.keys().next().value); // key1

获取第一个value

console.log(m.values().next().value); // {}

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对的支持。

相关文章

qq安全中心解绑短信失败怎么办图文

qq安全中心解绑短信失败怎么办图文

安全中心,短信发送,图文教程,步骤,短信,  为了您的帐号安全,QQ安全中心只支持在手机上解绑。qq安全中心解绑短信失败怎么办?两种方法解决QQ解除保护模式多次发短信验证失败。在这里分享给大家解决qq安全中心解绑短信发送失败的方法教程。希…

如何利用PS结合

如何利用PS结合

电脑软件,PS,拼图游戏是用ps来匹配图片的,我们可以试试看。但是很多同学都不是很清楚。下面是一些小编的图片,如何用PS来加入图片,让大家看看。 一种将图片与ps相结合的方法 1、运行软件(PS CS3版本为例),打开图像进行,得到背景层。如下图。 2、…

解决方法:An error occurred on th

解决方法:An error occurred on th

解决方法,电脑软件,occurred,server,processing,在WINDOWS7或SERVER2008上安装了IIS7.5,调试ASP程序时出现以下错误:An error occurred on the server when processing the URL. Please contact the system administrator解决方法如下:设置方…

mysql利用参数sql_safe_updates限

mysql利用参数sql_safe_updates限

参数,详解,电脑软件,mysql,sql_safe_updates,前言大家应该都知道,我们在mysql运维中出现过不少因为update/delete条件错误导致数据被误更新或者删除的case,为避免类似问题的发生,可以用sql_safe_updates参数来对update/delete做限制。这个参数…

Excel语言基础中VBA标识符有什么作

Excel语言基础中VBA标识符有什么作

语言基础,标识符,作用,有什么,用途,  VBA标识符是一种标识变量、常量、过程、函数、类等语言构成单位的符号,利用它可以完成对变量、常量、过程、函数、类等的引用。以下是小编为您带来的关于Excel语言基础中VBA标识符,希望对您有所帮助。E…

ps可选颜色调色及原理是什么

ps可选颜色调色及原理是什么

可选,原理,颜色,电脑软件,ps,   "可选颜色"是Adobe Photoshop中的一条关于色彩调整的命令。但与色阶,色彩平衡和色相饱和度相比,就没有那么直观,所以大家常常遇到可选颜色时,并不是那么顺手,我也在网络上查了查关于可选颜色的教…

photoshop怎么粘贴照片

photoshop怎么粘贴照片

照片,电脑软件,photoshop,   当我们在使用pd的时候,可以将一张或多张照片粘贴至另一张照片上,也可以将一张或多张照片粘贴至新建的画布上。下面跟小编来了解一下怎么做吧!photoshop粘贴照片的方法一、将一张照片粘贴至另一张照片…

对MySQLCURDATE实例详解()函数

对MySQLCURDATE实例详解()函数

函数,详解,实例,电脑软件,MySQLCURDATE,MySQL CURDATE函数介绍 如果字符串的上下文或yyymmdd格式用于在数字背景下,了CURDATE()函数将返回的值为格式的当前日期。 下面的示例演示如何使用CURDATE()在一个字符串中的功能。 SQL >选择CURDATE(); --…

PS人物照片怎么进行面部精修?

PS人物照片怎么进行面部精修?

照片,面部,人物,电脑软件,PS,一个人像的照片拍出来以后难免有不完美的地方,我们就可以通过PS这样的一个工具来精修一下,从而让照片更加完美的呈现出来。软件名称:Adobe Photoshop 8.0 中文完整绿色破解版软件大小:150.1MB更新时间:2015-11-041、…

ps怎么设计浓厚艺术色彩的桌面背景

ps怎么设计浓厚艺术色彩的桌面背景

浓厚,色彩,艺术,桌面背景,电脑软件,制作艺术桌面背景效果主要利用ps的滤镜功能,现在就把制作的过程和截图分享给大家,效果如下图所示,希望对你有所帮助和启发。软件名称:Adobe photoshop 7.01 官方正式简体中文版软件大小:154MB更新时间:2013-04-…

PHP实现向关联数组指定的Key之前插

PHP实现向关联数组指定的Key之前插

元素,方法,数组,电脑软件,PHP,本文实例讲述了PHP实现向关联数组指定的Key之前插入元素的方法。分享给大家供大家参考,具体如下:PHP 关联数组可以通过三种方式插入新元素:1. $array[$insert_key] = $insert_value;2. $array = array_merge($arr…

笔记本win10截图快捷键

笔记本win10截图快捷键

快捷键,截图,电脑软件,每个人都会有需要截图的时候,那么在使用win10系统的你知道如何快速便捷的去截图吗?不需要运用QQ也可以轻松方便的截图哦。台式电脑键盘的快捷键1、这是最简单的,【PrintScreen】键即可,整个屏幕的图像会被复制到剪贴板。…