ES6 set介绍和用法详解

本文概述

• 设置属性
• 设定方法
• 弱集
• 迭代器

集合是一种数据结构, 可让你创建唯一值的集合。集是处理单个对象或单个值的集合。

Set是类似于数组的值的集合, 但不包含任何重复项。它使我们可以存储唯一值。它支持原始值和对象引用。

与映射相似, 集合也被排序, 即集合中的元素按其插入顺序进行迭代。它返回设置的对象。

语法

var s = new Set("val1", "val2", "val3");

让我们通过使用以下示例来理解集合的概念：

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
console.log(colors);

集合的所有元素必须唯一。因此, 以上示例中的设置颜色仅包含四个不同的元素。成功执行以上代码后, 我们将获得以下输出。

输出如下

Set { 'Green', 'Red', 'Orange', 'Yellow' }

让我们看一下Set的属性和方法。

设置属性

设定尺寸

Set对象的此属性返回表示Set对象中元素数量的值。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
console.log(colors.size);
console.log(colors);

输出如下

4
Set { 'Green', 'Red', 'Orange', 'Yellow' }

设定方法

set对象包括几种方法, 其列表如下：

现在, 我们将详细了解Set对象的上述方法。

Set.prototype.add(值)

此方法用于将具有现有值的新元素追加到Set对象。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
colors.add('Violet');
colors.add('Indigo');
colors.add('Blue');
colors.add('Violet');
console.log(colors.size);
console.log(colors);

输出如下

7
Set { 'Green', 'Red', 'Orange', 'Yellow', 'Violet', 'Indigo', 'Blue' }

Set.prototype.clear()

它将清除集合中的所有对象。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
colors.add('Violet');
colors.add('Indigo');
colors.add('Blue');
colors.add('Violet');
colors.clear()
console.log(colors.size);

输出如下

0

Set.prototype.delete(值)

此方法用于从set对象中删除相应的传递值。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
colors.add('Violet');
colors.add('Indigo');
colors.add('Blue');
colors.add('Violet');
colors.delete('Violet');
console.log(colors.size);
console.log(colors);

输出如下

6
Set { 'Green', 'Red', 'Orange', 'Yellow', 'Indigo', 'Blue' }

Set.prototype.entries()

它返回一个新的集合迭代器的对象。它包含每个元素的值的数组。它保持插入顺序。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
colors.add('Violet');
colors.add('Indigo');
colors.add('Blue');
colors.add('Violet');
var itr = colors.entries();
for(i=0;i<colors.size;i++)  {
    console.log(itr.next().value); 
}

输出如下

[ 'Green', 'Green' ]
[ 'Red', 'Red' ]
[ 'Orange', 'Orange' ]
[ 'Yellow', 'Yellow' ]
[ 'Violet', 'Violet' ]
[ 'Indigo', 'Indigo' ]
[ 'Blue', 'Blue' ]

Set.prototype.forEach(callbackFn [, thisArg])

它为每个Map条目执行一次指定的回调函数。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
colors.add('Violet');
colors.add('Indigo');
colors.add('Blue');
colors.add('Violet');
function details(values){
    console.log(values);
}
colors.forEach(details);

输出如下

Green
Red
Orange
Yellow
Violet
Indigo
Blue

Set.prototype.has(值)

它返回一个布尔值, 该值指示元素以及相应的值在Set对象中是否存在。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
colors.add('Violet');
colors.add('Indigo');
colors.add('Blue');
colors.add('Violet');
console.log(colors.has('Indigo'));
console.log(colors.has('Violet'));
console.log(colors.has('Cyan'));

输出如下

true
true
false

Set.prototype.values()

它返回一个新的迭代器对象, 该对象包含按插入顺序设置的Set对象中每个元素的值。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
colors.add('Violet');

var val = colors.values();
console.log(val.next().value); 
console.log(val.next().value); 
console.log(val.next().value); 
console.log(val.next().value); 
console.log(val.next().value);

输出如下

Green
Red
Orange
Yellow
Violet

弱集

它用于存储对象的集合。它类似于Set对象, 因此它也不能存储重复值。与弱映射相似, 弱集合不能被迭代。弱集只能包含可能被垃圾回收的对象。

弱集合仅包括Set对象的add(value), delete(value)和has(value)方法。

例子

'use strict' 
   let ws = new WeakSet();  
   let obj = {msg:"Welcome Back!"}; 
   ws.add(obj); 
   console.log(ws.has(obj)); 
   ws.delete(obj); 
   console.log(ws.has(obj));

输出如下

true
false

迭代器

迭代器是一个对象, 它定义序列和终止时的返回值。它允许一次访问一组对象。 Set和Map都包含返回迭代器的方法。

迭代器是具有next()方法的对象。当next()方法被调用时, 迭代器将返回一个对象以及’value’和’done’属性。

‘done’是一个布尔值, 在读取集合中的所有元素后返回true。否则, 它返回false。

让我们一起了解Iterator和Set对象的实现。

例子

let colors = new Set(['Green', 'Red', 'Orange', 'Yellow', 'Red']);
var itr = colors.keys();
var itr1 = colors.entries();
var itr2 = colors.values();
console.log(itr.next());
console.log(itr1.next());
console.log(itr2.next());

输出如下

{ value: 'Green', done: false }
{ value: [ 'Green', 'Green' ], done: false }
{ value: 'Green', done: false }