javascript setの使い方
- 2020.09.28
- javascript
- javascript
javascriptで、ES6で追加されたsetの簡単な使い方を記述してます。Setは、重複する値を入れることができない特徴があります。
環境
- OS windows10 pro 64bit
- Apache 2.4.43
- ブラウザ chrome 84.0.4147.105
setの使い方
まずは、setに値を追加してみます。
|
1 2 3 4 5 6 7 |
var set = new Set(); set.add("java"); set.add("ruby"); // 格納している値の数を確認 console.log(set.size); //2 |
setは、既にaddしている値は追加することができません。
|
1 2 3 4 5 6 7 8 9 10 11 |
var set = new Set(); set.add("java"); set.add("ruby"); // 格納している値の数を確認 console.log(set.size); //2 set.add("ruby"); console.log(set.size); //2 |
for-ofを使用して、setした値を取得することが可能です。
|
1 2 3 4 5 6 7 8 |
var set = new Set(); set.add("java"); set.add("ruby"); for (var value of set) { console.log(value); } |
実行結果
forEachを使用して、setした値を取得することも可能です。
|
1 2 3 4 5 6 7 8 |
var set = new Set(); set.add("java"); set.add("ruby"); set.forEach((value) => { console.log(value); }) |
実行結果
スプレッド構文を使って、配列として表示することもできます。
|
1 2 3 4 5 6 |
var set = new Set(); set.add("java"); set.add("ruby"); console.log([...set]); |
実行結果
値を削除する場合は、deleteを利用します。
|
1 2 3 4 5 6 7 8 9 10 |
var set = new Set(); set.add("java"); set.add("ruby"); set.delete("ruby"); set.forEach((value) => { console.log(value); // java }) |
全ての値を削除する場合は、clearを使用します。
|
1 2 3 4 5 6 7 |
var set = new Set(); set.add("java"); set.add("ruby"); set.clear(); console.log(set.size); // 0 |
まとめて配列を使って、setすることも可能です。
|
1 2 3 4 5 |
var set = new Set(["java", "ruby", "c#"]); set.forEach((value) => { console.log(value); }) |
実行結果
チェーンメソッドを使用して追加することも可能です
|
1 2 3 4 5 6 7 |
var set = new Set(); set.add("java").add("ruby").add("C#"); set.forEach((value) => { console.log(value); }) |
実行結果
値が存在するかは、hasを使用して確認します。
|
1 2 3 4 |
var set = new Set(["java", "ruby", "c#"]); console.log(set.has("java")); // true console.log(set.has("python")); // false |
-
前の記事
Rails データベースの値をjsonで出力する 2020.09.28
-
次の記事
javascript Symbol.iteratorを使用して反復可能なオブジェクトや配列を取得する 2020.09.28