JavaScript(ES6)学习笔记-Set和Map数据结构(一)
一、Set
1、ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
Set 本身是一个构造函数,用来生成 Set 数据结构。
var s = new Set([, , , , '']);
s; // Set {1, 2, 3, "3"}
//重复元素在Set中自动被过滤:
2、Set 函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化。
//要创建一个Set,需要提供一个Array作为输入,或者直接创建一个空Set var s1 = new Set(); // 空Set
var s2 = new Set([1, 2, 3]); // 含1, 2, 3
3、Set.size
:返回Set
实例的成员总数
var s2 = new Set([1, 2, 3,'56666']);
console.log(s2.size) //
4、四个操作方法。
add(value)
:添加某个值,返回Set结构本身。//通过add(key)方法可以添加元素到Set中,可以重复添加,但不会有效果:
var s = new Set([1, 2, 3]); // 含1, 2, 3
s.add(4);
s; // Set {1, 2, 3, 4}
s.add(4);
s; // 仍然是 Set {1, 2, 3, 4}delete(value)
:删除某个值,返回一个布尔值,表示删除是否成功。//通过delete(key)方法可以删除元素: var s = new Set([1, 2, 3]);
s; // Set {1, 2, 3}
s.delete(3);
s; // Set {1, 2}has(value)
:返回一个布尔值,表示该值是否为Set
的成员。var s = new Set([1, 2, 3]);
s; // Set {1, 2, 3}
s.has(3) //true
clear()
:清除所有成员,没有返回值。var s = new Set([1, 2, 3]);
s; // Set {1, 2, 3}
s.clear(); //undefined
s;//Set{}
5、Set结构的实例有四个遍历方法,可以用于遍历成员。
var s2 = new Set([1, 2, 3,'55555']); // 含1, 2, 3
keys()
:返回键名的遍历器values()
:返回键值的遍历器entries()
:返回键值对的遍历器由于 Set 结构没有键名,只有键值(或者说键名和键值是同一个值),所以
keys
方法和values
方法的行为完全一致。entries
方法返回的遍历器,同时包括键名和键值,所以每次输出一个数组,它的两个成员完全相等。forEach()
:使用回调函数遍历每个成员
var s2 = new Set([1, 2, 3,'55555']); // 含1, 2, 3
s2.forEach(function (element, sameElement, set) {
console.log(element);
});
//1,2,3,55555
//Set与Array类似,但Set没有索引,因此回调函数的前两个参数都是元素本身
for...of
循环遍历Set
var s2 = new Set([1, 2, 3,'55555']); // 含1, 2, 3
for (var x of s2) {
console.log(x); // 1、2、3、55555
}
6、扩展运算符(...
)内部使用for...of
循环,所以也可以用于Set结构
let set = new Set(['red', 'green', 'blue']);
let arr = [...set];
// ['red', 'green', 'blue']
7、使用Set可以很容易地实现并集(Union)、交集(Intersect)和差集(Difference)
let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]); // 并集
let union = new Set([...a, ...b]);
// Set {1, 2, 3, 4} // 交集
let intersect = new Set([...a].filter(x => b.has(x)));
// set {2, 3} // 差集
let difference = new Set([...a].filter(x => !b.has(x)));
// Set {1}
二、Map Map
是一组键值对的结构,具有极快的查找速度
ES6提供了Map数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object结构提供了“字符串—值”的对应,Map结构提供了“值—值”的对应,是一种更完善的Hash结构实现。如果你需要“键值对”的数据结构,Map比Object更合适。
1、初始化Map
需要一个二维数组,或者直接初始化一个空Map
var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]); var m1 = new Map(); // 空Map
2、Map 的方法
set()、has()、get()、delete()
var m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的key-value
m.has('Adam'); // 是否存在key 'Adam': true
m.get('Adam'); //
m.delete('Adam'); // 删除key 'Adam'
m.get('Adam'); // undefined
3、结合数组的map
方法、filter
方法,可以实现Map的遍历和过滤(Map本身没有map
和filter
方法)。
let map0 = new Map()
.set(1, 'a')
.set(2, 'b')
.set(3, 'c'); let map1 = new Map(
[...map0].filter(([k, v]) => k < 3)
);
// 产生Map结构 {1 => 'a', 2 => 'b'} let map2 = new Map(
[...map0].map(([k, v]) => [k * 2, '_' + v])
);
// 产生Map结构 {2 => '_a', 4 => '_b', 6 => '_c'}
JavaScript(ES6)学习笔记-Set和Map数据结构(一)的更多相关文章
- es6学习笔记-set和map数据结构
ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. const s = new Set(); [2, 3 ...
- js-ES6学习笔记-Set和Map数据结构
1.ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. 2.Set 函数可以接受一个数组(或类似数组的对 ...
- 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中的Set与Map数据结构
本文实例讲述了ES6学习笔记之Set和Map数据结构.分享给大家供大家参考,具体如下: 一.Set ES6提供了新的数据结构Set.类似于数组,只不过其成员值都是唯一的,没有重复的值. Set本身是一 ...
- JS&ES6学习笔记(持续更新)
ES6学习笔记(2019.7.29) 目录 ES6学习笔记(2019.7.29) let和const let let 基本用法 let 不存在变量提升 暂时性死区 不允许重复声明 块级作用域 级作用域 ...
- ES6学习笔记之变量的解构赋值
变量的解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构. 数组的解构赋值 以前,为变量赋值,只能直接指定值: 1 2 3 var a = 1; var b = 2; ...
- JavaScript正则表达式学习笔记(二) - 打怪升级
本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...
- es6学习笔记-class之一概念
前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ...
随机推荐
- 关于${pageContext.request.contextPath}的理解 (转载)
${pageContext.request.contextPath}是JSP取得绝对路径的方法,等价于<%=request.getContextPath()%> . 也就是取出部署的应用程 ...
- [转]有return的情况下try catch finally的执行顺序
结论: 1.不管有没有出现异常,finally块中代码都会执行: 2.当try和catch中有return时,finally仍然会执行: 3.finally是在return后面的表达式运算后执行的(此 ...
- std::bind学习
std::bind bind是对C++98标准中函数适配器bind1st/bind2nd的泛化和增强,可以适配任意的可调用对象,包括函数指针.函数引用.成员函数指针和函数对象. bind接受的第一个参 ...
- 软件工程实践小项目之模拟wc.exe的小程序
github源码和工程文件地址:https://github.com/Jackchenyu/Word_counts/tree/smart 基本要求:要实现wc的基本功能即文件中字符数.单词数.行数的统 ...
- Python数据分析Numpy库方法简介(四)
Numpy的相关概念2 副本和视图 副本:复制 三种情况属于浅copy 赋值运算 切片 视图:链接,操作数组是,返回的不是副本就是视图 c =a.view().创建a的视图/影子和切片一样都是浅cop ...
- random模块写的验证码
import randomabc=''for i in range(4): a=random.randrange(0,4) if i != a: b=chr(random.r ...
- Qt做发布版,解决声音和图片、中文字体乱码问题(需要在main里写上QApplication::addLibraryPath("./plugins")才能加载图片,有图片,很清楚)
前些天做Qt发布版,发现居然不显示图片,后来才发现原来还有图片的库没加!找找吧,去qt的安装包,我装在了F盘,在F盘F:/QT/qt/plugins,找到了plugins,这里面有个 imagefor ...
- SSH服务理论+实践
1)远程管理服务知识介绍 SSH远程登录服务介绍说明 01. SSH-Secure Shell Protocol 安全加密shel协议 SSH远程登录服务功能作用 01. 提供类似telnet远程登录 ...
- How use Nmon and "Java Nmon Analyzer" for Monitor Linux Performance
Nmon is a resource monitoring tools which can monitor CPU, Memory, Disks, Network and even Filesyst ...
- JavaScript自定义求和函数
我爱撸码,撸码使我感到快乐!大家好,我是Counter,当看到这个标题到时候是不是感觉很简单,千万不要大意哦,你说0.1 + 0.2 = 0.3 ?有时候计算机并不是我们所说绝对精确,这个时候就要我们 ...