ES6學習之資料結構Set

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

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

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

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

上面**表示，由於兩個空物件不相等，所以它們被視為兩個值。

屬性：size，返回set例項的成員總數。

操作方法：add(), delete(), has(), clear()

下面是乙個對比，看看在判斷是否包括乙個鍵上面，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);

遍歷方法：keys(), values(), entries(), foreach()

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 結構的例項與陣列一樣，也擁有foreach方法，用於對每個成員執行某種操作，沒有返回值。

let 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物件。

let dedupestring = (str) => [...new set(str)].join('');
console.log(dedupestring('aaaddddssseee'));
//adse

let dedupearray = (arr) => 
console.log(dedupearray(['1','1','4','4','2','2','3','4','5']));
//[ '1', '4', '2', '3', '5' ]

let a = new set([1, 2, 3]);
let b = new set([4, 3, 2]);
// 並集
let union = new set([...a, ...b]);
// set 
// 交集
let intersect = new set([...a].filter(x => b.has(x)));
// set 
// 差集
let difference = new set([...a].filter(x => !b.has(x)));
// set

陣列的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結構：

如果想在遍歷操作中，同步改變原來的 set 結構，目前沒有直接的方法，但有兩種變通方法。一種是利用原 set 結構對映出乙個新的結構，然後賦值給原來的 set 結構；另一種是利用array.from方法。

// 方法一
let set = new set([1, 2, 3]);
set = new set([...set].map(val => val * 2));
// set的值是2, 4, 6
// 方法二
let set = new set([1, 2, 3]);
set = new set(array.from(set, val => val * 2));
// set的值是2, 4, 6

ES6學習之資料結構Set

ES6學習之 set 資料結構

ES6 資料結構 Set

ES6學習之set和map資料結構

ES6學習之 資料結構Set

ES6學習之 set 資料結構

ES6 資料結構 Set

ES6學習之set和map資料結構

相關推薦

ES6學習之資料結構Set