トモジSetオブジェクトって何？
詳しく知りたい・・
本記事は、
上記のような方に向けて記事を書いています。
こんにちは、トモジです。
私はプログラミング未経験から独学で勉強して、
簡易的な動的サイト・ゲーム・サービスが
作れる状態になりました。
本記事は、Setオブジェクトに関して要点を
わかりやすく説明しております。
JavaScriptのSetオブジェクト
Setオブジェクトは、重複しない値の集合を
管理するためのオブジェクトで
ES2015から新たに導入されました。
size
sizeとは、
Setオブジェクトで追加した要素数を返します。
sizeに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('りんご'); //要素の追加
set.add('ゴルゴ'); //要素の追加
set.add('パンツ'); //要素の追加
console.log('set : ' + set.size);set(size) : 3
add
addは、
指定した値を追加し重複の場合は無視されます。
addに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('りんご'); //要素の追加
set.add('ゴルゴ'); //要素の追加
set.add('パンツ'); //要素の追加
set.add('パンツ'); //要素の追加
set.add('パンツ'); //要素の追加
console.log('set(add重複) : ' + set.size);set(add重複) : 3
has
hasは、指定した要素が存在するかを確認します。
hasに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('りんご');
set.add(10);
console.log('has(りんご) : ' + set.has('りんご'));
console.log('has(10) : ' + set.has(10));
console.log('has(ご) : ' + set.has('ご'));has(りんご) : true
has(10) : true
has(ご) : false
delete
deleteは、指定した要素を削除します。
deleteに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('りんご');
set.add('ゴルゴ');
set.add('パンツ');
console.log('size(削除前) : ' + set.size);
set.delete('ゴルゴ');
console.log('size(削除後) : ' + set.size);size(削除前) : 3
size(削除後) : 2
clear
clearは、すべての要素を削除します。
clearに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('りんご');
set.add('ゴルゴ');
set.add('パンツ');
console.log('size(削除前) : ' + set.size);
set.clear();
console.log('size(削除後) : ' + set.size);size(削除前) : 3
size(削除後) : 0
entries
entriesは、setオブジェクトの
各要素を挿入順に取り出します。
setオブジェクトは、key を持つことはありませんので
[value,value]の形で新しい
イテレーターオブジェクトを返します。
※イテレータに関してわからない場合
entriesに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('りんご');
set.add('ゴルゴ');
set.add('パンツ');
const iterator = set.entries();
console.log('1 : ' + iterator.next().value);
console.log('2 : ' + iterator.next().value);
console.log('3 : ' + iterator.next().value);1 : りんご,りんご
2 : ゴルゴ,ゴルゴ
3 : パンツ,パンツ
values
valuesは、
setオブジェクトの各要素の値を挿入順に取り出し
新しいイテレーターオブジェクトを返します。
valuesに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('りんご');
set.add('ゴルゴ');
set.add('パンツ');
var vales = set.values();
console.log('val先頭 : ' + vales);
console.log('1 : ' + vales.next().value);
console.log('2 : ' + vales.next().value);
console.log('3 : ' + vales.next().value);1 : りんご
2 : ゴルゴ
3 : パンツ
forEach
forEachは、
指定した関数をsetの各値ごとに処理をします。
forEachに関して
// Sapオブジェクトの生成
let set = new Set();
set.add('1番目:')
set.add('2番目:')
set.add('3番目:')
function func(value, set) {
console.log(value, this);
}
let thisValue = "thisの値";
set.forEach(func, thisValue);1番目: thisの値
2番目: thisの値
3番目: thisの値
まとめ
最後にこの記事のポイントをまとめておきます。
Setオブジェクト
size
要素数を取得add
要素を追加has
指定した要素が存在するかを確認delete
指定した要素を削除clear
すべての要素を削除entries
各要素を挿入順に取得values
各要素の値を挿入順に取得forEach
指定した関数をsetの各値ごとに処理