LVLPATH

日本最強無料プログラミングスクール

PATHSERVICEHANDS ONMANZI
JavaScript集合

JavaScript基礎文法: 集合

✅ 集合(Set)とは?

Set は JavaScript における 重複のない値のコレクション(集合) を表すオブジェクトです。

配列のように見えて、同じ値を2つ以上持つことができないのが特徴です。

✅ 基本構文

const mySet = new Set([値1, 値2, 値3]);

Set に値を追加・削除・確認するメソッドは以下のとおりです。

mySet.add(値);       // 値を追加
mySet.delete(値);    // 値を削除
mySet.has(値);       // 値が存在するか確認
mySet.size;          // 要素数
mySet.clear();       // 全て削除

✅ Setの特徴

  • 値の 重複を許さない
  • 配列と違ってインデックスアクセス(set[0])はできない
  • add() や delete() などのメソッドで値を操作する
  • 配列の重複を取り除く用途として非常に便利
  • 配列の線形探索よりも、集合のhas()などの条件一致のほうが要素数が増えた際にパフォーマンスがいい

✅ 練習

実際に手を動かして挙動を確認してみましょう。

重複を除いて保持する

const set = new Set([1, 2, 3, 3, 4]);
console.log(set);
// Set(4) {1, 2, 3, 4}

値を追加・削除・確認する

const set = new Set();

set.add("apple");
set.add("banana");
set.add("apple"); // 重複なので追加されない

console.log(set.has("apple"));  // true
console.log(set.has("orange")); // false

set.delete("banana");
console.log(set); // Set(1) { "apple" }

set.clear(); // 全削除
console.log(set); // Set(0) {}

配列から重複を取り除く

const numbers = [1, 2, 2, 3, 3, 4];
const uniqueNumbers = [...new Set(numbers)];

console.log(uniqueNumbers); // [1, 2, 3, 4]

Set をループで処理する

const set = new Set(["A", "B", "C"]);

set.forEach(value => {
  console.log(value);
});
// A
// B
// C

オブジェクトの扱いに注意

const obj1 = {};
const obj2 = {};

const set = new Set([obj1]);

console.log(set.has(obj2)); // false(中身が同じでも別オブジェクトなので false)

✅ 練習のコツ

  • Set に値を追加したり削除したりしながら動きを観察してみよう
  • 配列から Set で重複を除去して、新しい配列を作る練習もしてみよう
  • ループや .has() など、どのメソッドがどんな動きをするかを試してみると理解が深まります

✅ まとめ(Set)

  • Set は 重複を許さない集合 を扱うオブジェクト
  • add, delete, has で値を操作
  • 配列の重複を取り除くときにとても便利
  • インデックスアクセスはできないのでループ処理は forEach() や for...of を使う
お問い合わせ