ES6 で Set および WeakSet_javascript テクニックを使用する方法

ES6 は、Set と WeakSet という 2 つの新しいデータ構造を提供します。 Set は配列に似ていますが、メンバー変数の値は一意であり、重複する値はありません。 WeakSet も一意の値のコレクションですが、オブジェクトを保存するためにのみ使用できます。

1. セットの使用

(1)Set 自体は Set データ構造を生成するコンストラクターを提供します。

var s = new Set();
[2,2,2,5,8,16,2,1].map(x => s.add(x))

for(i of s){console.log(i)}
//2,5,8,16,1

(2) Set() 関数は、初期化の構築パラメーターとして配列を受け入れることができます。

var s = new Set([1,2,3,4,2,4,3]);
[...s]
//[1,2,3,4]

注: Set に値を追加するときに型変換は行われないため、5 と "5" は 2 つの異なる値であり、Set は 2 つの値が等しいかどうかを内部的に判断します。 = ==、これは 2 つのオブジェクトが常に等しくないことを意味します。リストの外にあるのは NaN 自体だけです (完全等価演算子は、NaN がそれ自体に等しくないものとみなされます)

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

上記のコードは、2 つの空のオブジェクトが正確に等しくないため、2 つの異なる値であることを意味します。

(3)メソッドと属性を設定する

(3.1)属性を設定する

Set.prototype.size: Set インスタンスのメンバーの数を返します。
Set.prototype.constructor: デフォルトのコンストラクター Set 関数。

(3.2)設定演算機能

add(value): 値を追加し、Set 構造体自体を返します。
delete(value): 特定の値を削除し、削除が成功したことを示すブール値を返します。
has(value): パラメーターが Set のメンバーであるかどうかを示すブール値を返します。
clear(): すべてのメンバーをクリアします。戻り値はありません。

var set = new Set();
set.add(1).add(2).add(22).add(22);
set.size//3

set.hae(22)//true
set.has(4)//false
set.delete(2)//true

(3.3)トラバーサル操作の設定

Set には 4 つの走査メソッドがあります。メンバーを横断するために使用できます。
key(): キー名のトラバーサーを返します
value() : 値トラバーサー
を返します。 events(): キーと値のペアのトラバーサを返します
forEach(): コールバック関数を使用して各メンバーを走査します

注: Set にはキー名がなく、値名のみがあるため、keys() と value() によって返される結果は同じです。

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

//所以，entries方法返回的遍历器同时包括键名和值，所以每次输出的是一个数组。其实成员都是完全一样的。

注: Set はデフォルトでトラバース可能であり、そのデフォルトのトラバーサ生成関数はその value メソッドです。
これは、values メソッドを省略し、for...of を直接使用してトラバースできることを意味します。

var set = new Set([1,2,3,4]);
for(let x of set){
console.log(x);
}
//1
//2
//3
//4

スプレッド演算子 (...) を使用すると、for...of ループが内部で使用されるため、Set 構造体にも使用できます。

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

(3.4)Set は和集合、交差集合、差集合を実装します

let set1 = new Set([1,2,3,4,5,6]);
let set2 = new Set([4,5,6,7,8,9]);

//并集
let union = new Set([...set1,...set2]);
//[1,2,3,4,5,6,7,8,9]
//交集
let intersect = new Set([...set1].filter(x => b.has(s)));
//[4,5,6]
//差集
let intersect = new Set([...set1].filter(x => !b.has(s)));
//[1,2,3,4]

(3.5)Set は forEach

の使用を実装します。

let set = new Set([1,2,3,4,5,6]);
set.forEach(value,key)=>consloe.log(vlaue+1);
//2
//3
//4
//5
//6
//7

注: forEach メソッドのパラメーターは処理関数であり、これは (キー値、キー名) コレクション自体です。さらに、forEach メソッドには、バインド先のオブジェクトを表す 2 番目のパラメーターがあります。

2.WeakSet の使用

WeakSet は Set に似ており、非反復値のコレクションでもあります。ただし、オブジェクトを保存するためにのみ使用できます。他のタイプの値は使用できません。
WeakSet はコンストラクターです。配列および配列のようなオブジェクトを引数として受け入れることができます。 (実際には、反復可能なインターフェイスを持つ任意のオブジェクトを WeakSet のパラメーターとして使用できます)。配列のすべてのメンバーは自動的に WeakSet インスタンス オブジェクトのメンバーになります。
var a = 新しい [[1,2],[3,4]]; var ws = 新しい WeakSet(a);

var ws = new WeakSet();
ws.add(1);//TypeError:Invalid value used in weak set 
ws.add(Symbol);//TypeError:Invalid value used in weak set 

値とシンボルを追加すると、同時にエラーが報告されます。

WeakSet 構造には次のメソッドがあります

WeakSet.protoptype.add(value): WeakSet インスタンスに新しいメンバーを追加します。
WeakSet.protoptype.delete(value): WeakSet インスタンスの指定されたメンバーを削除します。
WeakSet.protoptype.has(value): 値が WeakSet インスタンス内にあるかどうかを示すブール値を返します。

var ws = new WeakSet();
var obj = {};
var foo = {};
ws.add(window);
ws.add(obj);
ws.has(window);//true
ws.has(foo);false
ws.delete(window);//true
ws.has(window);//false

メンバーは弱参照であり、いつでも消滅する可能性があるため、WeakSet を走査することはできません。横断が完了した直後にメンバーがいなくなっている可能性があります。 WeakSet の用途の 1 つは、DOM ノードがドキュメントから削除されたときにメモリ リークを心配せずにそれらのノードを保存することです。