ES6学习之Set和Map
一、Set
1.Set
定义:Set类似于数组,但成员的值都是唯一的,没有重复的值
let s = new Set([1,2,3,4,5,2,4]); //Set { 1, 2, 3, 4, 5 }
Set转数组
let s = new Set([1, 2, 3, 4, 5, 2, 4]);
//方法一:
let arr = [...s]; //[ 1, 2, 3, 4, 5 ]
//方法二
let arr2 = Array.from(s); //[ 1, 2, 3, 4, 5 ]
利用Set实现数组去重
let arr = [1, 2, 3, 5, 2, 1,NaN,NaN,"5",0,-0];
//Set内部使用精确等于,类似于===,但NaN等于NaN
let arr2 = [...new Set(arr)];
console.log(arr2) //[ 1, 2, 3, 5, NaN, '5', 0 ]
Set实例的属性
- constructor(构造函数,默认就是
Set函数)
let s = new Set();
s.constructor //[Function: Set]
- size(返回
Set实例的成员总数)
let s = new Set([1, 2, 6, 5, 4, 3, 3, 1]);
s.size //
Set实例的方法
add(value):添加成员,返回Set结构本身
delete(value):删除成员,返回Set结构本身
has(value):判断成员是否存在,返回布尔值
clear():清除所有成员,没有返回值
let s = new Set();
s.add(1).add(2); //Set { 1, 2 }
s.delete(1); //Set { 2 }
s.has(1) //false
s.clear()
console.log(s) //Set {}
Set遍历操作
keys():返回键名的遍历器
values():返回键值的遍历器
entries():返回键值对的遍历器
forEach():使用回调函数遍历每个成员
let s = new Set(["green", "blue", "red"]);
for (let item of s) { //默认取values
console.log(item) //green blue red
} for (let item of s.values()) {
console.log(item) //green blue red
} for (let item of s.keys()) {
console.log(item) //green blue red
} for (let item of s.entries()) {
console.log(item) //[ 'green', 'green' ] [ 'blue', 'blue' ] [ 'red', 'red' ]
} s.forEach((value, key) => {
console.log(key + ":" + value)
}) //green:green blue:blue red:red
Set取交集,并集和差集(数组的map好filter方法可以应用于Set)
let s1 = new Set([1, 2, 3, 4, 5]);
let s2 = new Set([1, 3, 5, 7, 9]);
//并集
let s3 = new Set([...s1, ...s2]); //Set { 1, 2, 3, 4, 5, 7, 9 }
//交集
let s4 = new Set([...s1].filter(x => s2.has(x))); //Set { 1, 3, 5 }
//差集
let s5 = new Set([...s1].filter(x => !s2.has(x))) //Set { 2, 4 }
2.WeakSet
定义:不重复的值的集合,成员只能是对象(obj,arr),而不能是其他类型的值。WeakSet 中的对象都是弱引用,即垃圾回收机制不考虑 WeakSet 对该对象的引用。
let s = new WeakSet([[1,2],[3,4]]); //ok
let s2 = new WeakSet([1,2,3]); //error
方法:add(value),delete(value),has(value),不能遍历(不能使用forEach等)也没有size属性
let s = new WeakSet();
let foo = {};
let obj = {}; s.add(foo).add(obj);
s.delete(foo);
s.has(foo)
二、Map
1.Map
定义:类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。
const m = new Map();
const o = {p: 'Hello World'}; m.set(o, 'content')
m.get(o) // "content"
//数组
let map = new Map([
["name", "fred"],
["age", 23]
])
console.log(map) //Map { 'name' => 'fred', 'age' => 23 } //Set
let set = new Set([
["name", "fred"],
["age", 23]
])
let map1 = new Map(set);
console.log(map1) //Map { 'name' => 'fred', 'age' => 23 } //Map
let m = new Map([
["name", "fred"],
["age", 23]
])
let map2 = new Map(m);
console.log(map2) //Map { 'name' => 'fred', 'age' => 23 }
Map的键:对象(绑定内存地址,只有对同一对象的引用,才视为同一个键),简单数据类型(只要两个值严格相等(===),Map 将其视为一个键)
let map = new Map();
let a = ['a'];
let b = ['a'];
map.set(a, "111").set(b, "222"); //引用类型a和b的内存地址不一样,视为两个key
console.log(map) //Map { [ 'a' ] => '111', [ 'a' ] => '222' } let map2 = new Map();
map2.set(-0, "111").set(0, "222"); //简单数据类型,严格等于-0===0,后者覆盖前者
console.log(map2) //Map { 0 => '222' }
属性和方法
size():返回 Map 结构的成员总数
set(key,value):设置键名key对应的键值为value
get(key):读取key对应的键值,如果找不到key,返回undefined
delete(key):删除某个键,返回true
has(key):返回一个布尔值,表示某个键是否在当前 Map 对象之中
clear():清除所有成员,没有返回值
let map = new Map();
map.set("name","fred");
map.get("name");
map.has("name");
map.size;
map.delete("name");
map.clear()
遍历方法
let map = new Map([
["name","fred"],
["age",23]
]);
for (let item of map.keys()){
console.log(item)
} //name age for (let item of map.values()){
console.log(item)
} //fred 23 for (let item of map.entries()){
console.log(item)
} //[ 'name', 'fred' ] [ 'age', 23 ] for (let [key,value] of map){
console.log(key,value)
} //name fred age 23 map.forEach(function(value, key, map) {
console.log("Key: %s, Value: %s", key, value);
}); //Key: name, Value: fred Key: age, Value: 23
与数组的map方法、filter方法结合使用
let map = new Map([
[1,"fred"],
[2,23]
]); let map1 = new Map(
[...map].filter(([k,v])=>k<2)
) //Map { 1 => 'fred' } let map2 = new Map(
[...map].map(([k,v])=>[k*2,v])
) //Map { 2 => 'fred', 4 => 23 }
2.WeakMap
定义:与Map结构类似,也是用于生成键值对的集合。键名只能是对象,键名所指向的对象,不计入垃圾回收机制。
let map = new WeakMap();
let key = {foo: 1};
map.set(key, 2) //ok
map.set(1, 2) //error
语法:没有遍历操作(即没有key()、values()和entries()方法),也没有size属性。只有四个方法可用:get()、set()、has()、delete()
const wm = new WeakMap(); // size、forEach、clear 方法都不存在
wm.size // undefined
wm.forEach // undefined
wm.clear // undefined
ES6学习之Set和Map的更多相关文章
- es6学习笔记-set和map数据结构
ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. const s = new Set(); [2, 3 ...
- es6 学习7 Set 和 Map 数据结构
Set 和 Map 数据结构 一.Set ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. const set = new Set([1, 2, 3, 4, ...
- ES6学习笔记(10)----Set和Map数据结构
参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ Set和Map数据结构 1.Set 基本用法 Set是一种新的数据结构,它的成员都是唯一 ...
- ES6学习目录
前面的话 ES6是JavaScript语言的下一代标准,已经在 2015 年 6 月正式发布.它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言 为什么要学 ...
- javascript的ES6学习总结(第二部分)
1.数组循环 介绍数组循环之前,先回顾一下ES5数组的循环 (1)数组遍历(代替普通的for):arr.forEach(callback(val,index,arr){todo}) //val是数组的 ...
- javascript的ES6学习总结(第一部分)
ES6(ESNext学习总结——第一部分) ES6, 全称 ECMAScript 6.0 ,是 JavaScript 的下一个版本标准,2015.06 发版. ECMA每年6月份,发布一个版本 201 ...
- ES6中的Set与Map数据结构
本文实例讲述了ES6学习笔记之Set和Map数据结构.分享给大家供大家参考,具体如下: 一.Set ES6提供了新的数据结构Set.类似于数组,只不过其成员值都是唯一的,没有重复的值. Set本身是一 ...
- javascript的ES6学习总结(第三部分)
1.ES6中的面向对象的类 1.1.定义类 在ES5中,我们写一个类,通常是这么写的 function Person(name,age){ this.name = name; this.age = a ...
- ES6学习笔记之变量的解构赋值
变量的解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构. 数组的解构赋值 以前,为变量赋值,只能直接指定值: 1 2 3 var a = 1; var b = 2; ...
随机推荐
- Module 'curl' already loaded in Unknown on line 0
Module 'curl' already loaded in Unknown on line 0 应该是php binary已经包含curl,你又动态加载了一遍.屏蔽掉你的extension 引用, ...
- table control里面各种属性和事件
[转自]http://blog.csdn.net/hackai886/article/details/7935366 SAP中,Table Control是在Screen中用的最广泛的控件之一了,可以 ...
- Call method 的使用
SAP学习日志---Call method 的使用 以及常见错误 转载▼ 可以通过以下方法 call method 1. 进入全局类中 找到方法,拖到程序中 2. 使用pattern 中的 AAB ...
- 第10条:尽量用enumerate取代range
核心要点: (1)enumerate函数提供了一种精简的写法,可以在遍历迭代器时获知每个元素的索引. (2)尽量用enumerate来改写那种将range与下标访问相结合的序列遍历代码. (3)可以给 ...
- LeetCode:盛最多水的容器【11】
LeetCode:盛最多水的容器[11] 题目描述 给定 n 个非负整数 a1,a2,...,an,每个数代表坐标中的一个点 (i, ai) .在坐标内画 n 条垂直线,垂直线 i 的两个端点分别为 ...
- [原创]关于在CentOS 7.0 下 安装nfs ,遇见 Transaction check error问题的解决
今天小弟的同学在使用阿里云的服务器安装nfs的时候,出现了一下问题 Transaction check error: file /usr/lib/systemd/system/blk-availabi ...
- hadoop集群增加新节点
上次hadoop集群一块数据盘报警, 提交工单后维修人员更换硬盘 服务器是dell r720的, 8盘位, 蛋疼的是这些硬盘都是做的单盘raid1,维修人员说必须关机导入硬盘才能正常使用 (服务器就这 ...
- EntityFramework 学习 一 Stored Procedure
CREATE PROCEDURE [dbo].[GetCoursesByStudentId] -- Add the parameters for the stored procedure here @ ...
- Javascript中 节流函数 throttle 与 防抖函数 debounce
问题的引出 在一些场景往往由于事件频繁被触发,因而频繁地进行DOM操作.资源加载,导致UI停顿甚至浏览器崩溃. 在这样的情况下,我们实际上的需求大多为停止改变大小n毫秒后执行后续处理:而其他事件大多的 ...
- bootstrap-自定义导航栏隐藏参数@screen-sm
导航菜单默认在屏幕小于768px的时候自动折叠,怎么自定义这个大小? 需要重新编译bootstrap 编译 CSS 和 JavaScript 文件 问题解决!