学习之路,长路漫漫,写学习笔记的过程就是把知识讲给自己听的过程。这个过程中,我们去记录思考的过程,便于日后复习,梳理自己的思路。学习之乐,独乐乐,不如众乐乐,把知识讲给更多的人听,何乐而不为呢?
- 项目中解决的问题
JavaScript的对象(Object)本质上是键值对的集合(Hash结构),但是传统上只能使用字符串作为键,这给它的使用带来了很大的限制。为了解决这个问题,ES6提供了Map数据结构。它类似于对象,也是键值对的集合,但其“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果需要使用“键值对”的数据结构,Map比Object更合适。
- 做题思路
Map 可以接受一个数组作为参数,该数组的成员是一个个表示键值对的数组。创建Map。
const map = new Map([ ['name', '张三'], ['title', 'Author'] ]); console.log(map);
get方法读取key对应的键值,如果找不到key,则返回undefined。
const map=new Map([ ['name','张三'], ['title','Author'] ]); map.set('friends',['大花','小朵']).set('edition',6); console.log(map.get('name'));//张三
has方法返回一个布尔值,判断某个键是否在当前Map对象之中。
const map = new Map([ ['name', '张三'], ['title', 'Author'] ]); map.set('friends',['大花','小朵']).set('edition', 6); console.log(map.has('edition')) //true console.log(map.has('name')) //true console.log(map.has('years')) //false
delete 方法删除某个键,如果删除成功,返回 true;如果删除失败,返回 false
const map = new Map([ ['name', '张三'], ['title', 'Author'] ]); map.set('friends',['大花','小朵']).set('edition', 6); console.log(map.has('edition')) //true console.log(map.has('name')) //true console.log(map.has('years')) //false
遍历方法
Map结构原生提供3个遍历器生成函数和1个遍历方法。具体使用方法查看示例31。
keys():返回键名的遍历器。
values():返回键值的遍历器。
entries():返回所有成员的遍历器。
forEach():遍历Map的所有成员。
const map = new Map([ ['name', '张三'], ['title', 'Author'] ]); for (let key of map.keys()) { console.log(key); //name title } for (let value of map.values()) { console.log(value); // 张三 Author } for (let [key, value] of map.entries()) { console.log(key, value); //name 张三 //title Author } map.forEach(function(value , index){ console.log(index + ":"+ value); //name:张三 //title:Author })
- 课堂上知识点的回顾
ECMAScript 6.0(以下简称 ES6)是JavaScript语言的下一代标准,已经在2015年6 月正式发布。ES6 的目标是使 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。ES6是ES5的升级版,解决了ES5语法中存在的一些问题,而且使用起来相对比较简单,在流行框架中使用较多。企业中对ES6的需求也在逐渐增强,对于前端开发者来说是非常有必要学习的一门技术。