ES6入门——Set和Map数据结构
来源:互联网 发布:php的就业前景好 编辑:程序博客网 时间:2024/04/30 07:03
Set
ES6提供了新的数据结构Set。类似于数组,只不过其成员值都是唯一的,没有重复的值。
Set本身是一个构造函数,用来生成Set数据结构。
var s = new Set();// 通过add方法向Set结构中加入成员[2, 3, 5, 4, 5, 2, 2].map(x => s.add(x))for (i of s) { console.log(i) }// 2 3 4 5 (表明set结构不会添加重复的值)
Set结构接收一个数组作为参数,用来初始化。
var items = new Set([1, 2, 3, 4, 5, 5, 5]);items.size // 5
向Set加入值的时候,不会发生类型转换。这意味着,在Set中5和”5”是两个不同的值。
Set结构有以下属性:
- Set.prototype.constructor: 构造函数,默认就是Set函数。
- set.prototype.size : 返回Set的成员总数。
Set结构有以下方法:
- add(value) : 添加某个值。
- delete(value) : 删除某个值。
- has(value) : 返回一个布尔值,表示该值是否为Set的成员。
- clear() : 清除所有成员。
s.add(1).add(2).add(2); // 注意“2”被加入了两次s.size //2s.has(1) // trues.has(2) // trues.has(3) // falses.delete(2);s.has(2) // false
下面对比以下,看看在判断是否包括一个键上面,对象和Set的写法有哪些不同。
// 对象写法var properties = { "width": 1, "height": 1};if ( properties[someName]) { // do something}/****************************************/// Set的写法var properties = new Set();properties.add('width');peoperties.add('height');if ( properties.has(someName) ) { // do something}
注意: Array.from方法可以将Set结构转换为数组。
var items = new Set([1, 2, 3, 4, 5]);var array = Array.from( items );
这也提供了一种除去数组中重复元素的方法。
function dedupe( array ) { return Array.from( new Set(array) );}
Map
基本用法
Js对象本质上是键值对的集合。但是只能使用字符串充当键。这在一定程度上给我们的使用带来很大的限制。
var data = {};var element = document.getElementById("myDiv");// 将DOM节点(即element)当做对象data的键.// 但是对象只接受字符串作为键名,所以element被自动转换为字符串"[Object HTMLDivElement]"data[element] = metadata;
而ES6正是为了解决这个问题才提供了Map结构。它类似与对象,也是键值对集合,但是”键”的范围不限于字符串,对象也可以当作键。
var m = new Map();o = {p: "hello world"};m.set(o, "content");console.log( m.get(o) ); // content
在上面的代码中,将对象o当作m的一个键。
Map函数可接收一个数组进行初始化。
var map = new Map([["name", "小明"], ["title", "Author"]]);map.size //2map.has("name"); //truemap.get("name"); //小明map.has("title"); //truemap.get("title"); //Author
注意:只有针对同一个对象的引用,Map结构才将其视作同一个键。这一点要非常小心才行。
var map = new Map();map.set(['a'], 555);map.get(['a']); // undefined
上面代码中set和get方法表面上是针对同一个键,但实际上这是两个值,内存地址是不一样的,因此get方法无法读取该键,返回undefined。
再看看下面一段代码:
var map = new Map();var k1 = ['a'];var k2 = ['a'];map.set(k1, 111);map.set(k2, 222);map.get( k1 ); //111map.get( k2 ); //222
上面代码,变量k1和k2的值是一样的,但是他们在Map结构中被视为两个键。即同样值的两个实例,在Map中被视为两个键。
属性和方法
Map结构有以下属性和方法:
- size : 返回成员总数。
- set(key, value) : 设置一个键值对。
- get(key) : 读取一个键。
- has(key) : 返回一个布尔值,表示某个键是否在Map结构中。
- delete(key) : 删除某个键。
- clear() : 清除所有成员。
var m = new Map();m.set("edition", 6); // 键是字符串m.set(262, "standard"); // 键是数字m.set(undefined, "nah"); //键是undefinedvar hello = function() { console.log("hello");}m.set(hello, "Hello ES6!"); //键是函数m.has("edition"); //truem.has("years"); //falsem.has(262); //truem.has(undefined); //truem.has(hello); //truem.delete( undefined ); m.has( undefined ); //falsem.get( hello ); //hello ES6!m.get("edition"); //6
遍历
Map原生提供三个遍历器。
- key() : 返回键名的遍历器。
- values() : 返回键值的遍历器。
- entries() : 返回所有成员的遍历器。
for ( let key of map.key() ) { console.log("key: %s", key);}for ( let value of map.value() ) { console.log("value: %s", value);}for ( let item of map.entries() ) { console.log("Key: %s, Value: %s", item[0], item[1]);}// same as using map.entries()for (let item of map) { console.log("Key: %s, Value: %s", item[0], item[1]);}
另外,Map还有一个forEach
方法,与数组中的forEach
方法类似,也可以实现遍历。
map.forEach(function(value, key, map) { console.log("Key: %s, Value: %s", key, value);});
forEach
方法还可接受第二个参数,用来绑定this
。
var reporter = { report: function(key, value) { console.log("key: %s, Value: %s", key, value); }};map.forEach(function(value, key, map) { this.report(key, value)}, reporter);
上面代码中,forEach()方法的回调函数中的this
, 就指向reporter
。
- ES6入门——Set和Map数据结构
- ES6 —(Set 和 Map 数据结构)
- es6 set和map数据结构
- ES6——set、map数据结构
- ES6-Set 和 Map 数据结构(ECMAScript 6 入门笔记)
- 自学-ES6篇-Set和Map数据结构
- es6常见属性Set和Map数据结构
- ES6 -- 新的数据结构:Set和Map
- ES6的数据结构set 和 map
- es6新特性-Set和Map数据结构
- ES6之Set和Map数据结构
- ES6入门之set和map
- ES6入门之set和map
- ES6入门之set和map
- 【ES6】set和map
- 【es6】Set 和 Map
- ES6--Set 和 Map
- ES6学习笔记(五)Set和Map数据结构
- Linux下redis的安装和配置简介
- 二分搜索
- 数据库复习(1)
- Nexus私服的安装和配置
- 跟我一起写shell补全脚本(Zsh篇)
- ES6入门——Set和Map数据结构
- scala 叠加在一起的特质 举例
- cocos2dx坐标体系详解
- 敏捷故事 4小时产品上线
- 线程(七)CallableAndFuture
- Oracle中导出一条记录的SQL
- ES6入门 —— Class和Module
- App推广平台有哪些
- 进程与线程之间的关系与区别分析