@@ -21,7 +21,7 @@ for (let i of s) {
21
21
22
22
上面代码通过` add() ` 方法向 Set 结构加入成员,结果表明 Set 结构不会添加重复的值。
23
23
24
- ` Set ` 函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化。
24
+ ` Set() ` 函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化。
25
25
26
26
``` javascript
27
27
// 例一
@@ -88,6 +88,23 @@ set.size // 2
88
88
89
89
上面代码表示,由于两个空对象不相等,所以它们被视为两个值。
90
90
91
+ ` Array.from() ` 方法可以将 Set 结构转为数组。
92
+
93
+ ``` javascript
94
+ const items = new Set ([1 , 2 , 3 , 4 , 5 ]);
95
+ const array = Array .from (items);
96
+ ```
97
+
98
+ 这就提供了去除数组重复成员的另一种方法。
99
+
100
+ ``` javascript
101
+ function dedupe (array ) {
102
+ return Array .from (new Set (array));
103
+ }
104
+
105
+ dedupe ([1 , 1 , 2 , 3 ]) // [1, 2, 3]
106
+ ```
107
+
91
108
### Set 实例的属性和方法
92
109
93
110
Set 结构的实例有以下属性。
@@ -142,23 +159,6 @@ if (properties.has(someName)) {
142
159
}
143
160
```
144
161
145
- ` Array.from() ` 方法可以将 Set 结构转为数组。
146
-
147
- ``` javascript
148
- const items = new Set ([1 , 2 , 3 , 4 , 5 ]);
149
- const array = Array .from (items);
150
- ```
151
-
152
- 这就提供了去除数组重复成员的另一种方法。
153
-
154
- ``` javascript
155
- function dedupe (array ) {
156
- return Array .from (new Set (array));
157
- }
158
-
159
- dedupe ([1 , 1 , 2 , 3 ]) // [1, 2, 3]
160
- ```
161
-
162
162
### 遍历操作
163
163
164
164
Set 结构的实例有四个遍历方法,可以用于遍历成员。
@@ -302,6 +302,122 @@ set = new Set(Array.from(set, val => val * 2));
302
302
303
303
上面代码提供了两种方法,直接在遍历操作中改变原来的 Set 结构。
304
304
305
+ ### 集合运算
306
+
307
+ [ ES2025] ( https://github.com/tc39/proposal-set-methods ) 为 Set 结构添加了以下集合运算方法。
308
+
309
+ - Set.prototype.intersection(other):交集
310
+ - Set.prototype.union(other):并集
311
+ - Set.prototype.difference(other):差集
312
+ - Set.prototype.symmetricDifference(other):对称差集
313
+ - Set.prototype.isSubsetOf(other):判断是否为子集
314
+ - Set.prototype.isSupersetOf(other):判断是否为超集
315
+ - Set.prototype.isDisjointFrom(other):判断是否不相交
316
+
317
+ 以上方法的参数都必须是 Set 结构,或者是一个类似于 Set 的结构(拥有` size ` 属性,以及` keys() ` 和` has() ` 方法。
318
+
319
+ ` .union() ` 是并集运算,返回包含两个集合中存在的所有成员的集合。
320
+
321
+ ``` javascript
322
+ const frontEnd = new Set ([" JavaScript" , " HTML" , " CSS" ]);
323
+ const backEnd = new Set ([" Python" , " Java" , " JavaScript" ]);
324
+
325
+ const all = frontEnd .union (backEnd);
326
+ // Set {"JavaScript", "HTML", "CSS", "Python", "Java"}
327
+ ```
328
+
329
+ ` .intersection() ` 是交集运算,返回同时包含在两个集合中的成员的集合。
330
+
331
+ ``` javascript
332
+ const frontEnd = new Set ([" JavaScript" , " HTML" , " CSS" ]);
333
+ const backEnd = new Set ([" Python" , " Java" , " JavaScript" ]);
334
+
335
+ const frontAndBackEnd = frontEnd .intersection (backEnd);
336
+ // Set {"JavaScript"}
337
+ ```
338
+
339
+ ` .difference() ` 是差集运算,返回第一个集合中存在但第二个集合中不存在的所有成员的集合。
340
+
341
+ ``` javascript
342
+ const frontEnd = new Set ([" JavaScript" , " HTML" , " CSS" ]);
343
+ const backEnd = new Set ([" Python" , " Java" , " JavaScript" ]);
344
+
345
+ const onlyFrontEnd = frontEnd .difference (backEnd);
346
+ // Set {"HTML", "CSS"}
347
+
348
+ const onlyBackEnd = backEnd .difference (frontEnd);
349
+ // Set {"Python", "Java"}
350
+ ```
351
+
352
+ ` .symmetryDifference() ` 是对称差集,返回两个集合的所有独一无二成员的集合,即去除了重复的成员。
353
+
354
+ ``` javascript
355
+ const frontEnd = new Set ([" JavaScript" , " HTML" , " CSS" ]);
356
+ const backEnd = new Set ([" Python" , " Java" , " JavaScript" ]);
357
+
358
+ const onlyFrontEnd = frontEnd .symmetricDifference (backEnd);
359
+ // Set {"HTML", "CSS", "Python", "Java"}
360
+
361
+ const onlyBackEnd = backEnd .symmetricDifference (frontEnd);
362
+ // Set {"Python", "Java", "HTML", "CSS"}
363
+ ```
364
+
365
+ 注意,返回结果中的成员顺序,由添加到集合的顺序决定。
366
+
367
+ ` .isSubsetOf() ` 返回一个布尔值,判断第一个集合是否为第二个集合的子集,即第一个集合的所有成员都是第二个集合的成员。
368
+
369
+ ``` javascript
370
+ const frontEnd = new Set ([" JavaScript" , " HTML" , " CSS" ]);
371
+ const declarative = new Set ([" HTML" , " CSS" ]);
372
+
373
+ declarative .isSubsetOf (frontEnd);
374
+ // true
375
+
376
+ frontEndLanguages .isSubsetOf (declarativeLanguages);
377
+ // false
378
+ ```
379
+
380
+ 任何集合都是自身的子集。
381
+
382
+ ``` javascript
383
+ frontEnd .isSubsetOf (frontEnd);
384
+ // true
385
+ ```
386
+
387
+ ` isSupersetOf() ` 返回一个布尔值,表示第一个集合是否为第二个集合的超集,即第二个集合的所有成员都是第一个集合的成员。
388
+
389
+ ``` javascript
390
+ const frontEnd = new Set ([" JavaScript" , " HTML" , " CSS" ]);
391
+ const declarative = new Set ([" HTML" , " CSS" ]);
392
+
393
+ declarative .isSupersetOf (frontEnd);
394
+ // false
395
+
396
+ frontEnd .isSupersetOf (declarative);
397
+ // true
398
+ ```
399
+
400
+ 任何集合都是自身的超集。
401
+
402
+ ``` javascript
403
+ frontEnd .isSupersetOf (frontEnd);
404
+ // true
405
+ ```
406
+
407
+ ` .isDisjointFrom() ` 判断两个集合是否不相交,即没有共同成员。
408
+
409
+ ``` javascript
410
+ const frontEnd = new Set ([" JavaScript" , " HTML" , " CSS" ]);
411
+ const interpreted = new Set ([" JavaScript" , " Ruby" , " Python" ]);
412
+ const compiled = new Set ([" Java" , " C++" , " TypeScript" ]);
413
+
414
+ interpreted .isDisjointFrom (compiled);
415
+ // true
416
+
417
+ frontEnd .isDisjointFrom (interpreted);
418
+ // false
419
+ ```
420
+
305
421
## WeakSet
306
422
307
423
### 含义
@@ -1283,3 +1399,7 @@ class Thingy {
1283
1399
1284
1400
由于无法知道清理器何时会执行,所以最好避免使用它。另外,如果浏览器窗口关闭或者进程意外退出,清理器则不会运行。
1285
1401
1402
+ ## 参考链接
1403
+
1404
+ - [ Union, intersection, difference, and more are coming to JavaScript Sets] ( https://www.sonarsource.com/blog/union-intersection-difference-javascript-sets/ )
1405
+
0 commit comments