mirror of
https://github.com/ruanyf/es6tutorial.git
synced 2025-05-25 03:02:21 +00:00
docs(set): edit weakMap & weakSet
This commit is contained in:
parent
ca2a2fc8b3
commit
e1bfba24ed
112
docs/set-map.md
112
docs/set-map.md
@ -227,7 +227,7 @@ set.forEach((value, key) => console.log(value * 2) )
|
|||||||
// 6
|
// 6
|
||||||
```
|
```
|
||||||
|
|
||||||
上面代码说明,`forEach`方法的参数就是一个处理函数。该函数的参数依次为键值、键名、集合本身(上例省略了该参数)。另外,`forEach`方法还可以有第二个参数,表示绑定的this对象。
|
上面代码说明,`forEach`方法的参数就是一个处理函数。该函数的参数依次为键值、键名、集合本身(上例省略了该参数)。另外,`forEach`方法还可以有第二个参数,表示绑定的`this`对象。
|
||||||
|
|
||||||
**(3)遍历的应用**
|
**(3)遍历的应用**
|
||||||
|
|
||||||
@ -296,6 +296,8 @@ set = new Set(Array.from(set, val => val * 2));
|
|||||||
|
|
||||||
## WeakSet
|
## WeakSet
|
||||||
|
|
||||||
|
### 含义
|
||||||
|
|
||||||
WeakSet 结构与 Set 类似,也是不重复的值的集合。但是,它与 Set 有两个区别。
|
WeakSet 结构与 Set 类似,也是不重复的值的集合。但是,它与 Set 有两个区别。
|
||||||
|
|
||||||
首先,WeakSet 的成员只能是对象,而不能是其他类型的值。
|
首先,WeakSet 的成员只能是对象,而不能是其他类型的值。
|
||||||
@ -310,7 +312,15 @@ ws.add(Symbol())
|
|||||||
|
|
||||||
上面代码试图向 WeakSet 添加一个数值和`Symbol`值,结果报错,因为 WeakSet 只能放置对象。
|
上面代码试图向 WeakSet 添加一个数值和`Symbol`值,结果报错,因为 WeakSet 只能放置对象。
|
||||||
|
|
||||||
其次,WeakSet 中的对象都是弱引用,即垃圾回收机制不考虑 WeakSet 对该对象的引用,也就是说,如果其他对象都不再引用该对象,那么垃圾回收机制会自动回收该对象所占用的内存,不考虑该对象还存在于 WeakSet 之中。这个特点意味着,无法引用 WeakSet 的成员,因此 WeakSet 是不可遍历的。
|
其次,WeakSet 中的对象都是弱引用,即垃圾回收机制不考虑 WeakSet 对该对象的引用,也就是说,如果其他对象都不再引用该对象,那么垃圾回收机制会自动回收该对象所占用的内存,不考虑该对象还存在于 WeakSet 之中。
|
||||||
|
|
||||||
|
这是因为垃圾回收机制依赖引用计数,如果一个值的引用次数不为`0`,垃圾回收机制就不会释放这块内存。对于那些不重要的引用,在结束使用之后,有时会忘记取消引用,导致内存无法释放,进而可能会引发内存泄漏。WeakSet 里面的引用,都不计入垃圾回收机制,所以就不存在这个问题。因此,WeakSet 适合临时存放一组对象,以及存放跟对象绑定的信息。只要这些对象在外部消失,它在 WeakMap 里面的引用就会自动消失。
|
||||||
|
|
||||||
|
由于上面这个特点,WeakSet 的成员是不适合引用的,因为它会随时消失。另外,由于 WeakSet 内部有多少个成员,取决于垃圾回收机制有没有运行,运行前后很可能成员个数是不一样的,而垃圾回收机制何时运行是不可预测的,因此 ES6 规定 WeakSet 不可遍历。
|
||||||
|
|
||||||
|
这些特点同样适用于本章后面要介绍的 WeakMap 结构。
|
||||||
|
|
||||||
|
### 语法
|
||||||
|
|
||||||
WeakSet 是一个构造函数,可以使用`new`命令,创建 WeakSet 数据结构。
|
WeakSet 是一个构造函数,可以使用`new`命令,创建 WeakSet 数据结构。
|
||||||
|
|
||||||
@ -878,7 +888,7 @@ jsonToMap('[[true,7],[{"foo":3},["abc"]]]')
|
|||||||
|
|
||||||
## WeakMap
|
## WeakMap
|
||||||
|
|
||||||
### 含义和用法
|
### 含义
|
||||||
|
|
||||||
`WeakMap`结构与`Map`结构类似,也是用于生成键值对。
|
`WeakMap`结构与`Map`结构类似,也是用于生成键值对。
|
||||||
|
|
||||||
@ -907,6 +917,8 @@ map.set(1, 2)
|
|||||||
// TypeError: 1 is not an object!
|
// TypeError: 1 is not an object!
|
||||||
map.set(Symbol(), 2)
|
map.set(Symbol(), 2)
|
||||||
// TypeError: Invalid value used as weak map key
|
// TypeError: Invalid value used as weak map key
|
||||||
|
map.set(null, 2)
|
||||||
|
// TypeError: Invalid value used as weak map key
|
||||||
```
|
```
|
||||||
|
|
||||||
上面代码中,如果将数值`1`和`Symbol`值作为 WeakMap 的键名,都会报错。
|
上面代码中,如果将数值`1`和`Symbol`值作为 WeakMap 的键名,都会报错。
|
||||||
@ -943,17 +955,16 @@ WeakMap 就是为了解决这个问题而诞生的,它的键名所引用的对
|
|||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
const wm = new WeakMap();
|
const wm = new WeakMap();
|
||||||
const element = document.querySelector('.element');
|
|
||||||
|
|
||||||
wm.set(element, 'Original');
|
const element = document.getElementById('example');
|
||||||
wm.get(element) // "Original"
|
|
||||||
|
|
||||||
element.parentNode.removeChild(element);
|
wm.set(element, 'some information');
|
||||||
element = null;
|
wm.get(element) // "some information"
|
||||||
wm.get(element) // undefined
|
|
||||||
```
|
```
|
||||||
|
|
||||||
上面代码中,变量`wm`是一个`WeakMap`实例,我们将一个`DOM`节点`element`作为键名,然后销毁这个节点,`element`对应的键就自动消失了,再引用这个键名就返回`undefined`。
|
上面代码中,先新建一个 Weakmap 实例。然后,将一个 DOM 节点作为键名存入该实例,并将一些附加信息作为键值,一起存放在 WeakMap 里面。这时,WeakMap 里面对`element`的引用就是弱引用,不会被计入垃圾回收机制。
|
||||||
|
|
||||||
|
也就是说,上面的 DOM 节点对象的引用计数是`1`,而不是`2`。这时,一旦消除对该节点的引用,它占用的内存就会被垃圾回收机制释放。Weakmap 保存的这个键值对,也会自动消失。
|
||||||
|
|
||||||
总之,`WeakMap`的专用场合就是,它的键所对应的对象,可能会在将来消失。`WeakMap`结构有助于防止内存泄漏。
|
总之,`WeakMap`的专用场合就是,它的键所对应的对象,可能会在将来消失。`WeakMap`结构有助于防止内存泄漏。
|
||||||
|
|
||||||
@ -972,6 +983,87 @@ wm.get(key)
|
|||||||
|
|
||||||
上面代码中,键值`obj`是正常引用。所以,即使在 WeakMap 外部消除了`obj`的引用,WeakMap 内部的引用依然存在。
|
上面代码中,键值`obj`是正常引用。所以,即使在 WeakMap 外部消除了`obj`的引用,WeakMap 内部的引用依然存在。
|
||||||
|
|
||||||
|
### WeakMap 的示例
|
||||||
|
|
||||||
|
WeakMap 的例子很难演示,因为无法观察它里面的引用会自动消失。此时,其他引用都解除了,已经没有引用指向 WeakMap 的键名了,导致无法证实那个键名是不是存在。
|
||||||
|
|
||||||
|
贺师俊老师[提示](https://github.com/ruanyf/es6tutorial/issues/362#issuecomment-292109104),如果引用所指向的值占用特别多的内存,就可以通过 Node 的`process.memoryUsage`方法看出来。根据这个思路,网友[vtxf](https://github.com/ruanyf/es6tutorial/issues/362#issuecomment-292451925)补充了下面的例子。
|
||||||
|
|
||||||
|
首先,打开 Node 命令行。
|
||||||
|
|
||||||
|
```bash
|
||||||
|
$ node --expose-gc
|
||||||
|
```
|
||||||
|
|
||||||
|
上面代码中,`--expose-gc`参数表示允许手动执行垃圾回收机制。
|
||||||
|
|
||||||
|
然后,执行下面的代码。
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
// 手动执行一次垃圾回收,保证获取的内存使用状态准确
|
||||||
|
> global.gc();
|
||||||
|
undefined
|
||||||
|
|
||||||
|
// 查看内存占用的初始状态,heapUsed 为 4M 左右
|
||||||
|
> process.memoryUsage();
|
||||||
|
{ rss: 21106688,
|
||||||
|
heapTotal: 7376896,
|
||||||
|
heapUsed: 4153936,
|
||||||
|
external: 9059 }
|
||||||
|
|
||||||
|
> let wm = new WeakMap();
|
||||||
|
undefined
|
||||||
|
|
||||||
|
> const b = new Object();
|
||||||
|
undefined
|
||||||
|
|
||||||
|
> global.gc();
|
||||||
|
undefined
|
||||||
|
|
||||||
|
// 此时,heapUsed 仍然为 4M 左右
|
||||||
|
> process.memoryUsage();
|
||||||
|
{ rss: 20537344,
|
||||||
|
heapTotal: 9474048,
|
||||||
|
heapUsed: 3967272,
|
||||||
|
external: 8993 }
|
||||||
|
|
||||||
|
// 在 WeakMap 中添加一个键值对,
|
||||||
|
// 键名为对象 b,键值为一个 5*1024*1024 的数组
|
||||||
|
> wm.set(b, new Array(5*1024*1024));
|
||||||
|
WeakMap {}
|
||||||
|
|
||||||
|
// 手动执行一次垃圾回收
|
||||||
|
> global.gc();
|
||||||
|
undefined
|
||||||
|
|
||||||
|
// 此时,heapUsed 为 45M 左右
|
||||||
|
> process.memoryUsage();
|
||||||
|
{ rss: 62652416,
|
||||||
|
heapTotal: 51437568,
|
||||||
|
heapUsed: 45911664,
|
||||||
|
external: 8951 }
|
||||||
|
|
||||||
|
// 解除对象 b 的引用
|
||||||
|
> b = null;
|
||||||
|
null
|
||||||
|
|
||||||
|
// 再次执行垃圾回收
|
||||||
|
> global.gc();
|
||||||
|
undefined
|
||||||
|
|
||||||
|
// 解除 b 的引用以后,heapUsed 变回 4M 左右
|
||||||
|
// 说明 WeakMap 中的那个长度为 5*1024*1024 的数组被销毁了
|
||||||
|
> process.memoryUsage();
|
||||||
|
{ rss: 20639744,
|
||||||
|
heapTotal: 8425472,
|
||||||
|
heapUsed: 3979792,
|
||||||
|
external: 8956 }
|
||||||
|
```
|
||||||
|
|
||||||
|
上面代码中,只要外部的引用消失,WeakMap 内部的引用,就会自动被垃圾回收清除。由此可见,有了 WeakMap 的帮助,解决内存泄漏就会简单很多。
|
||||||
|
|
||||||
|
### WeakMap 的语法
|
||||||
|
|
||||||
WeakMap 与 Map 在 API 上的区别主要是两个,一是没有遍历操作(即没有`key()`、`values()`和`entries()`方法),也没有`size`属性。因为没有办法列出所有键名,这个键名是否存在完全不可预测,跟垃圾回收机制是否运行相关。二是无法清空,即不支持`clear`方法。因此,`WeakMap`只有四个方法可用:`get()`、`set()`、`has()`、`delete()`。
|
WeakMap 与 Map 在 API 上的区别主要是两个,一是没有遍历操作(即没有`key()`、`values()`和`entries()`方法),也没有`size`属性。因为没有办法列出所有键名,这个键名是否存在完全不可预测,跟垃圾回收机制是否运行相关。二是无法清空,即不支持`clear`方法。因此,`WeakMap`只有四个方法可用:`get()`、`set()`、`has()`、`delete()`。
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
|
Loading…
x
Reference in New Issue
Block a user