11 Set和Map数据结构
Set和Map数据结构
- Set
- WeakSet
- Map
- WeakMap
首先 这四个对象都是 数据结构. 用于存放数据
Set 类似数组. 但是不能重复. 如果你有重复数据,会自动忽略
属性
- size 返回长度
- add 添加
- clear 全部清除
- delete 删除其中一个
- has 确认是否存在
支持 forEach 遍历,但是不支持其他数组的遍历方式.
支持 Iterator
用途,书中介绍了两种
- 除去重复数据.
- 实现交集,并集。
实现这两种比较方便.
new Set(...[1,1,1,1,1])
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 可以看做约等于 new Object()
只能说他可以使用 任何对象当做 key
而 Object 只能用 string
其他的原理和 {} 一样.
不过属性有些变化
- size
- set(key,value)
- get(key)
- has(key)
- delete(key)
- clear()
遍历
iterator & forEach
他提供了完整的方式. 所以能用 Map 就用
let map = new Map([
['F', 'no'],
['T', 'yes'],
]);
for (let key of map.keys()) {
console.log(key);
}
// "F"
// "T"
for (let value of map.values()) {
console.log(value);
}
// "no"
// "yes"
for (let item of map.entries()) {
console.log(item[0], item[1]);
}
// "F" "no"
// "T" "yes"
// 或者
for (let [key, value] of map.entries()) {
console.log(key, value);
}
// 等同于使用map.entries()
for (let [key, value] of map) {
console.log(key, value);
}
let map = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three'],
]);
[...map.keys()]
// [1, 2, 3]
[...map.values()]
// ['one', 'two', 'three']
[...map.entries()]
// [[1,'one'], [2, 'two'], [3, 'three']]
[...map]
// [[1,'one'], [2, 'two'], [3, 'three']]
至于 WeakSet & WeakMap
大致与 Set & Map 一致
但是参数只接受 对象 , 且不能遍历.
WeakSet不能遍历,是因为成员都是弱引用,随时可能消失,遍历机制无法保证成员的存在,很可能刚刚遍历结束,成员就取不到了。WeakSet的一个用处,是储存DOM节点,而不用担心这些节点从文档移除时,会引发内存泄漏。
WeakSet 其实都不适合存 DOM 元素. 因为只有一个值. 并没有什么意义.
const foos = new WeakSet()
class Foo {
constructor() {
foos.add(this)
}
method () {
if (!foos.has(this)) {
throw new TypeError('Foo.prototype.method 只能在Foo的实例上调用!');
}
}
}
这是书中的一个例子.
但是我并没有明白. 因为如果 Foo 的实力已经被回收. 自然也访问不了 method 方法了
至于 WeakMap 就比较适合保存 Dom
Dom元素作为 Key. value 保存一些信息.
Dom元素被移除,也不用担心内存.
let _counter = new WeakMap();
let _action = new WeakMap();
class Countdown {
constructor(counter, action) {
_counter.set(this, counter);
_action.set(this, action);
}
dec() {
let counter = _counter.get(this);
if (counter < 1) return;
counter--;
_counter.set(this, counter);
if (counter === 0) {
_action.get(this)();
}
}
}
let c = new Countdown(2, () => console.log('DONE'));
c.dec()
c.dec()
// DONE
还可以保证一些私有的属性.
一旦 Countdown 被删除,属性也随之消失.
我现在这一章并没有学到 Class
这种写法是否可以被另一种 class 原生的私有写法所替代
thx.
11 Set和Map数据结构的更多相关文章
- 11.Set 和 Map数据结构
1.set 基本用法 ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. const s = new S ...
- js-ES6学习笔记-Set和Map数据结构
1.ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. 2.Set 函数可以接受一个数组(或类似数组的对 ...
- ES6中的Set与Map数据结构
本文实例讲述了ES6学习笔记之Set和Map数据结构.分享给大家供大家参考,具体如下: 一.Set ES6提供了新的数据结构Set.类似于数组,只不过其成员值都是唯一的,没有重复的值. Set本身是一 ...
- ES6学习笔记(10)----Set和Map数据结构
参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ Set和Map数据结构 1.Set 基本用法 Set是一种新的数据结构,它的成员都是唯一 ...
- ES6中Map数据结构学习笔记
很多东西就是要细细的品读然后做点读书笔记,心理才会踏实- Javascript对象本质上就是键值对的集合(Hash结构),但是键只能是字符串,这有一定的限制. 1234 var d = {}var e ...
- ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环
ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. va ...
- ES6中的Set、Map数据结构
Map.Set都是ES6新的数据结构,他们都是新的内置构造函数.也就是说typeof的结果,多了两个. 他们是什么: Set是不能重复的数组. Map是可以任何东西当做键的对象: ES6 提供 ...
- ECMAScript 6之Set和Map数据结构
Set 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. var s = new Set(); [2, ...
- set和 map 数据结构
set/map数据结构 创建: var s=new Set(); 添加成员 s.add(1) 遍历 for of s.froEach 删除 s.delete() 判断存在 s.has() 清除 s. ...
随机推荐
- HTML学习(一)基础篇
这篇文章有人比我总结的好,适用于新手,我就适当的铺垫一下,结尾处会给你们网站,我就不班门弄斧了. 一)HTML结构 1.<head>标签 <title> <base/&g ...
- Android窗口机制分析与UI管理系统
类图关系 在看Android的窗口机制之前,先看看其主要的类图关系以及层级之间的依赖与调用关系 1.window在当前的android系统的中的呈现形式是PhoneWindow (frameworks ...
- android Intent介绍
Android中提供了Intent机制来协助应用间的交互与通讯,Intent负责对应用中一次操作的动作.动作涉及数据.附加数据进行描述,Android则根据此Intent的描述,负责找到对应的组件,将 ...
- 浅析匿名函数、lambda表达式、闭包(closure)区别与作用
浅析匿名函数.lambda表达式.闭包(closure)区别与作用 所有的主流编程语言都对函数式编程有支持,比如c++11.python和java中有lambda表达式.lua和JavaScript中 ...
- PHPmailer关于Extension missing: openssl报错的解决
最近在写一个网页的时候,需要用到PHPmailer来发送邮件,按照官网上给出的demo写出一个例子,却报错Extension missing: openssl 最后发现需要修改php.ini中的配置: ...
- centos7中没有安装ifconfig命令的解决方法
初装centos 7时,运行config报 command not found 错误,我在网上找了大量资料,下面的资料中查找原因和解决方式最详细,能很好的解决这个问题. ifconfig命令是设置或显 ...
- 错误 1 类型“System.Web.Mvc.ModelClientValidationRule”同时存在于“c:\Progra
问题如图: 解决办法: step1: 首先关闭你应用程序方案,在你保存项目的文件夹下找到ProjectName.csproj ProjectName是你实际的应用程序名称. step2: 用文字编辑 ...
- AspNetPager 多条件分页查询
AspNetPager 这个分页控件一般做后台基本都知道的,我就不多说了(说明与下载链接:http://www.webdiyer.com/Controls/AspNetPager),嘿嘿!其实我也是刚 ...
- css3
CSS3的换行 如果某个单词太长,不适合在一个区域内,它扩展到外面: 自动换行属性允许您强制文本换行 - 即使这意味着分裂它中间的一个字: 允许长文本换行: p {word-wrap:break-wo ...
- 关于Cewu Lu等的《Combining Sketch and Tone for Pencil Drawing Production》一文铅笔画算法的理解和笔录。
相关论文的链接:Combining Sketch and Tone for Pencil Drawing Production 第一次看<Combining Sketch and Tone f ...