es6 set 資料結構

es6 提供了新的資料結構 set。它類似於陣列，但是成員的值都是唯一的，沒有重複的值。

set 本身是乙個建構函式，用來生成 set 資料結構。

const s = new
set();
[2, 3, 5, 4, 5, 2, 2].foreach(x =>s.add(x));
for(let i of s) 
//2 3 5 4

上面**通過add方法向 set 結構加入成員，結果表明 set 結構不會新增重複的值。

set 函式可以接受乙個陣列（或者具有 iterable 介面的其他資料結構）作為引數，用來初始化。

//
例一const set = new set([1, 2, 3, 4, 4]);
[...set]
//[1, 2, 3, 4]
//例二
const items = new set([1, 2, 3, 4, 5, 5, 5, 5]);
items.size //5
//例三
const set = new set(document.queryselectorall('div'));
set.size 
//56
//類似於
const set = new
set();
document
.queryselectorall('div')
.foreach(div =>set.add(div));
set.size 
//56

上面**中，例一和例二都是set函式接受陣列作為引數，例三是接受類似陣列的物件作為引數。

上面**也展示了一種去除陣列重複成員的方法。

//
去除陣列的重複成員
[...new set(array)]

向 set 加入值的時候，不會發生型別轉換，所以5和"5"是兩個不同的值。set 內部判斷兩個值是否不同，使用的演算法叫做「same-value-zero equality」，它類似於精確相等運算子（===），主要的區別是nan等於自身，而精確相等運算子認為nan不等於自身。

let set = new
set();
let a =nan;
let b =nan;
set.add(a);
set.add(b);
set 
//set

上面**向 set 例項新增了兩個nan，但是只能加入乙個。這表明，在 set 內部，兩個nan是相等。

另外，兩個物件總是不相等的。

let set = new
set();
set.add({});
set.size //1
set.add({});
set.size 
//2

set 結構的例項有以下屬性。

set 例項的方法分為兩大類：操作方法（用於運算元據）和遍歷方法（用於遍歷成員）。下面先介紹四個操作方法。

上面這些屬性和方法的例項如下。

s.add(1).add(2).add(2);
//注意2被加入了兩次
s.size //2
s.has(1) //
true
s.has(2) //
true
s.has(3) //
false
s.delete(2);
s.has(2) //
false

下面是乙個對比，看看在判斷是否包括乙個鍵上面，object結構和set結構的寫法不同。

//
物件的寫法
const properties =;
if(properties[somename]) 
//set的寫法
const properties = new
set();
properties.add('width');
properties.add('height');
if(properties.has(somename))

array.from方法可以將 set 結構轉為陣列。

const items = new set([1, 2, 3, 4, 5]);
const array = array.from(items);

這就提供了去除陣列重複成員的另一種方法。

function
dedupe(array) 
dedupe([1, 1, 2, 3]) //
[1, 2, 3]

set 結構的例項有四個遍歷方法，可以用於遍歷成員。

需要特別指出的是，set的遍歷順序就是插入順序。這個特性有時非常有用，比如使用 set 儲存乙個**函式列表，呼叫時就能保證按照新增順序呼叫。

（1）keys()，values()，entries()

keys方法、values方法、entries方法返回的都是遍歷器物件（詳見《iterator 物件》一章）。由於 set 結構沒有鍵名，只有鍵值（或者說鍵名和鍵值是同乙個值），所以keys方法和values方法的行為完全一致。

let set = new set(['red', 'green', 'blue']);
for(let item of set.keys()) 
//red
//green
//blue
for(let item of set.values()) 
//red
//green
//blue
for(let item of set.entries()) 
//["red", "red"]
//["green", "green"]
//["blue", "blue"]

上面**中，entries方法返回的遍歷器，同時包括鍵名和鍵值，所以每次輸出乙個陣列，它的兩個成員完全相等。

set 結構的例項預設可遍歷，它的預設遍歷器生成函式就是它的values方法。

set.prototype[symbol.iterator] ===set.prototype.values
//true

這意味著，可以省略values方法，直接用for...of迴圈遍歷 set。

let set = new set(['red', 'green', 'blue']);
for(let x of set) 
//red
//green
//blue

（2）foreach()

set 結構的例項與陣列一樣，也擁有foreach方法，用於對每個成員執行某種操作，沒有返回值。

set = new set([1, 4, 9]);
set.foreach((value, key) => console.log(key + ' : ' +value))
//1 : 1
//4 : 4
//9 : 9

上面**說明，foreach方法的引數就是乙個處理函式。該函式的引數與陣列的foreach一致，依次為鍵值、鍵名、集合本身（上例省略了該引數）。這裡需要注意，set 結構的鍵名就是鍵值（兩者是同乙個值），因此第乙個引數與第二個引數的值永遠都是一樣的。

另外，foreach方法還可以有第二個引數，表示繫結處理函式內部的this物件。

（3）遍歷的應用

擴充套件運算子（...）內部使用for...of迴圈，所以也可以用於 set 結構。

let set = new set(['red', 'green', 'blue']);
let arr =[...set];
//['red', 'green', 'blue']

擴充套件運算子和 set 結構相結合，就可以去除陣列的重複成員。

let arr = [3, 5, 2, 2, 5, 5];
let unique = [...new
set(arr)];
//[3, 5, 2]

而且，陣列的map和filter方法也可以間接用於 set 了。

let set = new set([1, 2, 3]);
set = new set([...set].map(x => x * 2));
//返回set結構：
let set = new set([1, 2, 3, 4, 5]);
set = new set([...set].filter(x => (x % 2) == 0));
//返回set結構：

es6 set 資料結構

ES6 set資料結構

ES6 Set資料結構

ES6 Set資料結構

es6 set 資料結構

ES6 set資料結構

ES6 Set資料結構

ES6 Set資料結構

相關推薦