Newly available 主要ブラウザの最新版で対応済み。古いブラウザが対象外なら使用可能。

Set methods

difference() は Set インスタンスのメソッドで、集合を一つ受け取り、この Set に含まれており、与えられた集合に含まれない要素を含む新しい Set を返します。

Map・SetES2024

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
Set.difference
122
122
127
17
122
17
Set.intersection

intersection() は Set インスタンスのメソッドで、集合を受け取り、この Set と指定された集合の両方にある要素の入った新しい Set を返します。
122
122
127
17
122
17
Set.isDisjointFrom

isDisjointFrom() は Set インスタンスのメソッドで、集合を取り、この Set に与えられた集合と共通する要素がないことを示す論理値を返します。
122
122
127
17
122
17
Set.isSubsetOf

isSubsetOf() は Set インスタンスのメソッドで、集合を取り、この Set のすべての要素が与えられた集合にあることを示す論理値を返します。
122
122
127
17
122
17
Set.isSupersetOf

isSupersetOf() は Set インスタンスのメソッドで、集合を取り、与えられた集合のすべての要素がこの Set にあることを示す論理値を返します。
122
122
127
17
122
17
Set.symmetricDifference

symmetricDifference() は Set インスタンスのメソッドで、集合を受け取り、この Set と与えられた集合のどちらかにあるが、両方にはない要素の入った新しい Set を返します。
122
122
127
17
122
17
Set.union

union() は Set インスタンスのメソッドで、集合を受け取り、この Set と与えられた集合のどちらかまたは両方にある要素の入った新しい Set を返します。
122
122
127
17
122
17
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT 
const a = new Set([1, 2, 3, 4]);
const b = new Set([3, 4, 5, 6]);

a.union(b);              // Set {1, 2, 3, 4, 5, 6}
a.intersection(b);       // Set {3, 4}
a.difference(b);         // Set {1, 2}
a.symmetricDifference(b); // Set {1, 2, 5, 6}
a.isSubsetOf(b);         // false
a.isSupersetOf(b);       // false

ライブデモ

集合の和 (Union)

2つの集合を統合し、全ての重複しない要素を取得します。

プレビュー全画面表示

共通部分の抽出 (Intersection)

2つの集合の両方に含まれる要素（共通スキルなど）を抽出します。

プレビュー全画面表示

差分の抽出 (Difference)

一方の集合にあり、他方にはない要素（不足しているアイテムなど）を抽出します。

プレビュー全画面表示

実務での使いどころ

  • Set methods の活用

    difference() は Set インスタンスのメソッドで、集合を一つ受け取り、この Set に含まれており、与えられた集合に含まれない要素を含む新しい Set を返します。

注意点

  • 古いブラウザ（IE等）では対応していない。対象ブラウザを確認すること。

アクセシビリティ

  • JavaScript による動的更新時は、aria-live リージョンで変更をスクリーンリーダーに通知する。

参考リンク