Set クラスについて

・	Set クラスについて
・	Set オブジェクトを作成する
・	データを追加する
・	データを取得する
・	データを削除する

前のページに戻る

Set クラスについて

■ Set クラスについて

ECMAScript 6 世代の機能です。

データをコレクションする機能がまとまっています。

ユニーク（唯一）なデータを、追加、取得、除外できます。

■ Map クラスと Set クラスの違い

Map クラスは、ユニーク（唯一）なキー情報を使って、データを管理します。

Set クラスは、ユニーク（唯一）なデータを、直接収集します。

上に戻る

Set クラスについて

■ Set オブジェクトを作成する

■ WeakSet オブジェクトを作成する

■セットクラスのメソッドについて

■ WeakSet と値情報の参照関係について

■セットの種類について

Set クラスと、WeakSet クラスの２つがあります。

■ Set クラスの特性

オブジェクトを登録した場合、強参照となります。

■ WeakSet クラスの特性

オブジェクトを登録した場合、弱参照となります。

プリミティブデータを、登録する事はできません。

格納したデータを、順番に列挙する事はできません。

WeakSet オブジェクトは、イテレーターではありません。

■ Set オブジェクトを作成する

new 演算子を使って、Set オブジェクトを作成します。

new Set ( iterable ) :Set

第01引数(略可)	Iterable	（初期データを格納したい場合）Iterable なオブジェクトを指定。
戻り値	Set	新しい Set オブジェクトが得られる。

■第01引数（Iterable なオブジェクト）

初期データを格納しつつ、作成する場合に指定します。

イテレーターについては、こちらで解説しています。

■作成例

Set オブジェクトを作成する


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// 出力テスト
console.log(set);

初期データを指定しつつ、Set オブジェクトを作成する


// ------------------------------------------------------------
// 適当な配列を用意（Iterable なオブジェクト）
// ------------------------------------------------------------
var ary = [ "aaa" , "bbb" , "ccc" ];

// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set(ary);

// 出力テスト
console.log(set); // [ "aaa" , "bbb" , "ccc" ]

■ WeakSet オブジェクトを作成する

new 演算子を使って、WeakSet オブジェクトを作成します。

new WeakSet ( iterable ) :WeakSet

第01引数(略可)	Iterable	（初期データを格納したい場合）Iterable なオブジェクトを指定。
戻り値	WeakSet	新しい WeakSet オブジェクトが得られる。

■第01引数（Iterable なオブジェクト）

初期データを格納しつつ、作成する場合に指定します。

値にプリミティブ型が含まれると失敗します。

イテレーターについては、こちらで解説しています。

■作成例

WeakSet オブジェクトを作成する


// ------------------------------------------------------------
// WeakSet オブジェクトを作成
// ------------------------------------------------------------
var weak_set = new WeakSet();

// 出力テスト
console.log(weak_set);

初期データを指定しつつ、WeakSet オブジェクトを作成する


// ------------------------------------------------------------
// 適当な配列を用意（Iterable なオブジェクト）
// ------------------------------------------------------------
var ary = [
	new Array(),
	new Object(),
	new RegExp(""),
];

// ------------------------------------------------------------
// WeakSet オブジェクトを作成
// ------------------------------------------------------------
var weak_set = new WeakSet(ary);

// 出力テスト
console.log(weak_set); // [ [] , {} , /(?:)/ ]

■セットクラスのメソッドについて

■セットクラスのメソッド

メソッド	説明
set()	１つのデータを追加する
delete()	１つのデータを除外する
clear()	データをすべてクリアする
has()	データが存在するか調べる

メソッド	説明
forEach()	コールバック関数を使って、すべてのデータを順番に取得する。
entries()	Iterator オブジェクトを取得する（キーと値の列挙）
values()	Iterator オブジェクトを取得する（値の列挙）

■ WeakSet と値情報の参照関係について

■値情報の弱参照について

WeakSet は、オブジェクトの参照のみを、登録できます。

登録したオブジェクトは、弱参照となります。

WeakSet オブジェクトは、登録したオブジェクトを参照しません。

WeakSet オブジェクトには、値情報を列挙する手段がありません。

■値情報の消滅について

登録したオブジェクトが、どこからも参照されなくなった場合、ガベージコレクションの対象となります。

WeakSet オブジェクトにて利用中だったとしても、値情報は消滅します。

登録したオブジェクトの弱参照を確認する（タスクマネージャーからメモリ使用量の変化を確認）


// ------------------------------------------------------------
// WeakSet オブジェクトを作成
// ------------------------------------------------------------
var weak_set = new WeakSet();

// ------------------------------------------------------------
// 256 MByte 相当のバッファを作成
// ------------------------------------------------------------
var ary_u8 = new Uint8Array(1024 * 1024 * 256);

// ------------------------------------------------------------
// バッファを格納する
// ------------------------------------------------------------
weak_set.add( ary_u8 );

// ------------------------------------------------------------
// バッファへの参照を断つ（ガベージコレクションの対象となる）
// ------------------------------------------------------------
ary_u8 = null;

■ WeakSet の使用例について

自動的に消滅する可能性があるオブジェクトを、収集するのに便利です。

例えば、DOM オブジェクトが該当します。

上に戻る

データを追加する

１つのデータを追加する

■セットオブジェクトに、１つのデータを追加する

add() メソッドを使用します。

Set.add ( value ) :Set

第01引数(略可)	*	ユニーク（唯一）な、値情報を指定。
戻り値	Set	自身の Set オブジェクトが得られる

WeakSet.add ( value ) :Set

第01引数(略可)	Object	ユニーク（唯一）な、値情報を指定。（プリミティブ型の指定は不可）
戻り値	Set	自身の Set オブジェクトが得られる

■使用例

Set オブジェクトに、データを追加する（値情報にプリミティブ型を指定）


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// データを格納する
// ------------------------------------------------------------
set.add( false );
set.add( 12345 );
set.add( "str" );

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
set.forEach( function ( value ){
	console.log(value);
});

Set オブジェクトに、データを追加する（値情報にリファレンス型を指定）


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// オブジェクトを作成
// ------------------------------------------------------------
var obj = new Object();
var ary = new Array();

// ------------------------------------------------------------
// データを格納する
// ------------------------------------------------------------
set.add( obj );
set.add( ary );

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
set.forEach( function ( value ){
	console.log(value);
});

上に戻る

データを取得する

すべてのデータを順番に取得する（コールバック関数を使用）

すべてのデータを順番に列挙する（イテレーターを使用）

データが存在するか調べる

データの総数を取得する

■関数を使用して、データを順番に取得する

forEach() メソッドを使用します。

Set.forEach( callback , thisObj ) :Void

第01引数	Function	コールバック関数を指定
第02引数(略可)	*	コールバック関数内で this のアクセス先となるオブジェクトを指定。
戻り値	Void	なし

■第01引数（コールバック関数）

第01引数から、現在の値情報が得られます。

第02引数から、現在のキー情報（値情報と同等）が得られます。

第03引数から、自身の Set オブジェクトが得られます。

戻り値は対応していません。

forEach() メソッドを中断する方法はありません。

■使用例

関数を使用して、データを順番に取得する


// ------------------------------------------------------------
// Set オブジェクトを作成する
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// 適当なデータを格納する
// ------------------------------------------------------------
set.add( "aaa" );
set.add( "bbb" );
set.add( "ccc" );

// ------------------------------------------------------------
// コールバック関数を用意
// ------------------------------------------------------------
function callback( value , key , set ){

	// 出力テスト
	console.log("---");
	console.log(key);
	console.log(value);

}

// ------------------------------------------------------------
// 関数を使用して、データを順番に取得する
// ------------------------------------------------------------
set.forEach( callback );

関数を使用して、データを順番に取得する


// ------------------------------------------------------------
// Set オブジェクトを作成する
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// 適当なデータを格納する
// ------------------------------------------------------------
set.add( "aaa" );
set.add( "bbb" );
set.add( "ccc" );

// ------------------------------------------------------------
// 関数を使用して、データを順番に取得する
// ------------------------------------------------------------
set.forEach( function ( value , key , set ){

	console.log(arguments);

});

■セットオブジェクトに、データが存在するか調べる

has() メソッドを使用します。

Set.has ( value ) :Boolean

第01引数(略可)	*	値情報を指定。
戻り値	Boolean	既に登録済みなら true、存在しないなら false

WeakSet.has ( value ) :Boolean

第01引数(略可)	Object	値情報を指定。（プリミティブ型の指定は不可）
戻り値	Boolean	既に登録済みなら true、存在しないなら false

■使用例

Set オブジェクトに、データが存在するか調べる（値情報にリファレンス型を指定）


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// オブジェクトを作成
// ------------------------------------------------------------
var obj = new Object();
var ary = new Array();

// ------------------------------------------------------------
// データを格納する
// ------------------------------------------------------------
set.add( obj );

// ------------------------------------------------------------
// データが存在するか調べる
// ------------------------------------------------------------
var result0 = set.has( obj );
var result1 = set.has( ary );

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log(result0); // true
console.log(result1); // false

■セットオブジェクトの、データの総数を取得する

size プロパティを使用します。

WeakSet クラスには、存在しません。

■使用例

Set オブジェクトの、データの総数を取得する


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// 適当なデータを格納する
// ------------------------------------------------------------
set.add( "aaa" );
set.add( "bbb" );
set.add( "ccc" );
set.add( "ddd" );

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log( set.size ); // 4

上に戻る

Set クラスのイテレーターについて

Iterator オブジェクトを取得する（キーと値の列挙）

Iterator オブジェクトを取得する（値の列挙）

値情報を順番に列挙する（for..of 文）

■ Iterator オブジェクトを取得する（キーと値の列挙）

entries() メソッドを使用します。

値情報の書式は、[ key , value ] です。

キー情報は存在しないので、かわりに値情報が得られます。

Set.entries( ) :SetIterator

第01引数	Void	なし
戻り値	SetIterator	新しい Iterator オブジェクトが得られる（キーと値の列挙）

■使用例

Iterator オブジェクトを取得（キーと値の列挙）


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// 適当なデータを格納する
// ------------------------------------------------------------
set.add( "aaa" );
set.add( "bbb" );
set.add( "ccc" );
set.add( "ddd" );
set.add( "eee" );

// ------------------------------------------------------------
// Iterator オブジェクトを取得（キーと値の列挙）
// ------------------------------------------------------------
var iterator = set.entries();

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log( iterator.next() ); // { done:false , value:["aaa","aaa"] }
console.log( iterator.next() ); // { done:false , value:["bbb","bbb"] }
console.log( iterator.next() ); // { done:false , value:["ccc","ccc"] }
console.log( iterator.next() ); // { done:false , value:["ddd","ddd"] }
console.log( iterator.next() ); // { done:false , value:["eee","eee"] }
console.log( iterator.next() ); // { done:true  , value:undefined }
console.log( iterator.next() ); // { done:true  , value:undefined }
console.log( iterator.next() ); // { done:true  , value:undefined }

■ Iterator オブジェクトを取得する（値の列挙）

values() メソッドを使用します。

[Symbol.iterator]() メソッドと同等です。

Set.values( ) :SetIterator

第01引数	Void	なし
戻り値	SetIterator	新しい Iterator オブジェクトが得られる（値の列挙）

■使用例

Iterator オブジェクトを取得（値の列挙）


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// 適当なデータを格納する
// ------------------------------------------------------------
set.add( "aaa" );
set.add( "bbb" );
set.add( "ccc" );
set.add( "ddd" );
set.add( "eee" );

// ------------------------------------------------------------
// Iterator オブジェクトを取得（値の列挙）
// ------------------------------------------------------------
var iterator = set.values();

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log( iterator.next() ); // { done:false , value:"aaa" }
console.log( iterator.next() ); // { done:false , value:"bbb" }
console.log( iterator.next() ); // { done:false , value:"ccc" }
console.log( iterator.next() ); // { done:false , value:"ddd" }
console.log( iterator.next() ); // { done:false , value:"eee" }
console.log( iterator.next() ); // { done:true  , value:undefined }
console.log( iterator.next() ); // { done:true  , value:undefined }
console.log( iterator.next() ); // { done:true  , value:undefined }

■値情報を順番に列挙する（for..of 文）

■ for..of 文について

こちらで解説しています。

■使用例

for..of 文を使って、値情報を順番に取得する


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// 適当なデータを格納する
// ------------------------------------------------------------
set.add( "aaa" );
set.add( "bbb" );
set.add( "ccc" );
set.add( "ddd" );
set.add( "eee" );

// ------------------------------------------------------------
// 値情報を順番に列挙する
// ------------------------------------------------------------
var value;
for(value of set){
	console.log( value );
}

上に戻る

データを除外する

１つのデータを除外する

すべてのデータをクリアする

■セットオブジェクトから、１つのデータを除外する

delete() メソッドを使用します。

Set.delete ( value ) :Void

第01引数(略可)	*	値情報を指定
戻り値	Void	なし

WeakSet.delete ( value ) :Void

第01引数(略可)	Object	値情報を指定。（プリミティブ型の指定は不可）
戻り値	Void	なし

■使用例

Set オブジェクトから、データを除外する（値情報にプリミティブ型を指定）


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// データを格納する
// ------------------------------------------------------------
set.add( false );
set.add( 12345 );
set.add( "str" );

// ------------------------------------------------------------
// データを除外する
// ------------------------------------------------------------
set.delete( false );
set.delete( 12345 );
set.delete( "str" );

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
set.forEach(function(value){
	console.log(value);
});

Set オブジェクトから、データを除外する（値情報にリファレンス型を指定）


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// オブジェクトを作成
// ------------------------------------------------------------
var obj = new Object();
var ary = new Array();

// ------------------------------------------------------------
// データを格納する
// ------------------------------------------------------------
set.add( obj );
set.add( ary );

// ------------------------------------------------------------
// データを除外する
// ------------------------------------------------------------
set.delete( obj );
set.delete( ary );

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
set.forEach(function(value){
	console.log(value);
});

WeakSet オブジェクトから、データを除外する（値情報の弱参照）


// ------------------------------------------------------------
// WeakSet オブジェクトを作成（弱参照）
// ------------------------------------------------------------
var weak_set = new WeakSet();

// ------------------------------------------------------------
// オブジェクトを作成
// ------------------------------------------------------------
var obj = new Object();
var ary = new Array();

// ------------------------------------------------------------
// データを格納する
// ------------------------------------------------------------
weak_set.add( obj );
weak_set.add( ary );

// ------------------------------------------------------------
// オブジェクトへの参照を断つ
// ------------------------------------------------------------
obj = null;
ary = null;

■セットオブジェクトから、すべてのデータをクリアする

clear() メソッドを使用します。

Set.clear ( ) :Void

引数	Void	なし
戻り値	Void	なし

■使用例

セットオブジェクトから、すべてのデータを除外する


// ------------------------------------------------------------
// Set オブジェクトを作成
// ------------------------------------------------------------
var set = new Set();

// ------------------------------------------------------------
// 適当なデータを格納する
// ------------------------------------------------------------
set.add( "aaa" );
set.add( "bbb" );
set.add( "ccc" );

// ------------------------------------------------------------
// データをすべてクリアする
// ------------------------------------------------------------
set.clear();

// ------------------------------------------------------------
// 出力テスト
// ------------------------------------------------------------
console.log( set.size ); // 0

上に戻る

前のページに戻る