es6系列教程_ Map详解以及常用api介绍


Posted in Javascript onSeptember 25, 2017

ECMAScript 6中的Map类型是一种存储着许多键值对的有序列表。键值对支持所有的数据类型. 键 0 和 ‘0'会被当做两个不同的键,不会发生强制类型转换.

如何使用Map?

let map = new Map();

常用方法:

set( 键,值 ): 添加新的键值对元素

get( 键 ): 获取键对应的值,如果这个值不存在,返回undefined

let map = new Map();
map.set( '0', 'ghostwu' );
map.set( 0, 'ghostwu' );

console.log( map.get( '0' ) ); //ghostwu
console.log( map.get( 'name' ) ); //undefined;
let map = new Map();
var key1 = {}, key2 = {};

map.set( key1, 'ghostwu' );
map.set( key2, 22 );

console.log( map.get( key1 ) ); //ghostwu
console.log( map.get( key2 ) ); //22

可以用对象做为Map的键. 虽然是两个空对象,但是不会发生强类型转换.

has( key ): 判断键名是否存在

delete( key ):删除键名以及对应的值

clear(): 移除map集合中所有的键值对

size: map集合的元素个数

let map = new Map();
map.set( 'name', 'ghostwu' );
map.set( 'age', 22 );

console.log( map.has( 'name' ) );//true
console.log( map.size ); //2

map.delete( 'name' );
console.log( map.has( 'name' ) );//false
console.log( map.size ); //1
console.log( map.has( 'age' ) ); //true

map.clear();
console.log( map.size ); //0
console.log( map.has( 'age' ) ); //false

Map支持数组初始化,用一个二维数组,每个数组用键值对的方式

let map = new Map( [ [ 'name', 'ghostwu' ], [ 'age', 22 ] ] );
console.log( map.has( 'name') ); //true
console.log( map.has( 'age') ); //true
console.log( map.size ); //2
map.set( 'sex', 'man' );
console.log( map.size );
console.log( map.get( 'name' ) ); //ghostwu
map.clear();
console.log( map.size ); //0

Map也支持forEach方法,支持2个参数, 第一个:函数,函数中支持3个参数( 值,键,当前map ), 第二个: this

let map = new Map( [ [ 'name', 'ghostwu' ], [ 'age', 22 ] ] );
map.set( 'sex', 'man' );
map.forEach( function( val, key, cur ){
 console.log( val, key, cur, this );
}, 100 );

es6系列教程_ Map详解以及常用api介绍

以上这篇es6系列教程_ Map详解以及常用api介绍就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript对数组的常用操作代码 数组方法总汇
Jan 27 Javascript
IE6-IE9中tbody的innerHTML不能赋值的解决方法
Sep 26 Javascript
JS实现三级折叠菜单特效,其它级可自动收缩
Aug 06 Javascript
JavaScript精炼之构造函数 Constructor及Constructor属性详解
Nov 05 Javascript
Bootstrap实现各种进度条样式详解
Apr 13 Javascript
Angular 2父子组件数据传递之@ViewChild获取子组件详解
Jul 04 Javascript
三分钟学会用ES7中的Async/Await进行异步编程
Jun 14 Javascript
使用angularjs.foreach时return的问题解决
Sep 30 Javascript
element el-input directive数字进行控制
Oct 11 Javascript
浅谈关于JS下大批量异步任务按顺序执行解决方案一点思考
Jan 08 Javascript
vue实现评价星星功能
Jun 30 Javascript
Vue使用Proxy代理后仍无法生效的解决
Nov 13 Javascript
简单谈谈js的数据类型
Sep 25 #Javascript
实现两个文本框同时输入的实例
Sep 25 #Javascript
zTree jQuery 树插件的使用(实例讲解)
Sep 25 #jQuery
对于input 框限定输入值为浮点型的js代码
Sep 25 #Javascript
静态页面实现 include 引入公用代码的示例
Sep 25 #Javascript
React学习之事件绑定的几种方法对比
Sep 24 #Javascript
一文让你彻底搞清楚javascript中的require、import与export
Sep 24 #Javascript
You might like
php设计模式 Mediator (中介者模式)
2011/06/26 PHP
PHP在线生成二维码代码(google api)
2013/06/03 PHP
PHP实现获取FLV文件的时间
2015/02/10 PHP
javascript Array.remove() 数组删除
2009/08/06 Javascript
js禁止页面刷新禁止用F5键刷新禁止右键的示例代码
2013/09/23 Javascript
JS实现兼容各浏览器解析XML文档数据的方法
2015/06/01 Javascript
js实现改进的仿蓝色论坛导航菜单效果代码
2015/09/06 Javascript
jQuery AJAX timeout 超时问题详解
2016/06/21 Javascript
使用JS代码实现点击按钮下载文件
2016/11/12 Javascript
Vue ElementUI之Form表单验证遇到的问题
2017/08/21 Javascript
jQuery Dom元素操作技巧
2018/02/04 jQuery
基于Vue-cli快速搭建项目的完整步骤
2018/11/03 Javascript
JavaScript提升机制Hoisting详解
2019/10/23 Javascript
element el-tree组件的动态加载、新增、更新节点的实现
2020/02/27 Javascript
编写一个javascript元循环求值器的方法
2020/04/14 Javascript
[50:20]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第四局
2016/03/06 DOTA
python常用函数详解
2016/09/13 Python
Django框架的使用教程路由请求响应的方法
2018/07/03 Python
用Python shell简化开发
2018/08/08 Python
python算法与数据结构之冒泡排序实例详解
2019/06/22 Python
django框架F&Q 聚合与分组操作示例
2019/12/12 Python
Python sublime安装及配置过程详解
2020/06/29 Python
Python CategoricalDtype自定义排序实现原理解析
2020/09/11 Python
python批量生成条形码的示例
2020/10/10 Python
Jupyter notebook命令和编辑模式常用快捷键汇总
2020/11/17 Python
css3绘制天猫logo实现代码
2012/11/06 HTML / CSS
CSS3 filter(滤镜)实现网页灰色或者黑色模式的代码
2020/11/30 HTML / CSS
小学英语教学反思
2014/01/30 职场文书
绘画专业自荐信范文
2014/02/23 职场文书
法定代表人授权委托书范文
2014/08/02 职场文书
工程承包协议书范本
2014/09/29 职场文书
不尊敬老师检讨书范文
2014/11/19 职场文书
公司仓管员岗位职责
2015/04/01 职场文书
MySQL的join buffer原理
2021/04/29 MySQL
浅谈如何提高PHP代码质量之单元测试
2021/05/28 PHP
详解MySQL多版本并发控制机制(MVCC)源码
2021/06/23 MySQL