ホームページ > 記事 > ウェブフロントエンド > JavaScriptの設定とは何ですか?いつ使用しますか?使い方?
JavaScript では Set を使用する必要がある場合があります。次の記事では、Set を理解し、Set とは何か、Set をいつ使用するか、および Set のデータ操作 (交差、差集合、交差、対称差集合) を紹介します。
多くの場合、複数のリストを比較して、共通部分や差異があるかどうかなどを取得する必要があります。JavaScript にはこれをうまく実現できるデータ型があります。需要、つまり Set
です。
Set
オブジェクトは配列に似ていますが、一意の項目のみが含まれています。 Set
オブジェクトは値のコレクションであり、その要素は挿入順に反復できます。 Set
の要素は 1 回だけ表示されます。つまり、Set
の要素は一意です。
記事に含まれるコード アドレス: https://codepen.io/quintiontang/pen/rNmNbbY
Set## とは
#Set オブジェクトは値のコレクションです。その要素は挿入順に反復できます。要素は 1 回だけ表示されます。つまり、
Set は特定の順序ではなく、一意の値の保存されたコレクションです。スタック、キュー、配列などの他のコレクション タイプとは異なり、セットはリストの比較やセット内の項目の存在の検出に使用できます。
Set は、スタックやキューのデータ構造と同様に、その動作によって定義される抽象データ型です。
key-key の特性により、これは
Map に似ています。
JavaScript の Set は非常に基本的でシンプルですが、他のものほど機能はありません。言語 一般的な集合演算関数。独自のアルゴリズム (厳密な等価性
=== に基づくものではない) を使用して、要素が同一であるかどうかを検出します。
unknown、
null、および
NaN をコレクションに格納すると、たとえ
NaN であっても、1 回だけ格納されることを意味します。 != = NaN。通常、オブジェクト タイプのストレージに適用されます。
const setTest = new Set([0, -0, Infinity,null, undefined, null, NaN, NaN, Infinity,null]); console.log(setTest); // Set { 0, Infinity, null, undefined, NaN }上記の実行結果から次の結論が導き出されます:
と
NaN は等しくありませんが、
Set セットには
が 1 つだけ存在し、
Infinity には
# が 1 つだけ存在します。 Set set
##基本的な Set の使用方法はこの記事では紹介しません。
特定のリストを比較し、等しいかどうかを判断する必要がある場合は、Set を使用できます。 2 つの集合の和集合を取得します
2 つの集合を取得します差分セット
difference2 つのセットの共通部分を取得
intersection2 つのセットの対称差分セットを取得
intersectionDifference2 つのセットがサブセットであるかどうかを判断する
isSubset2 つのセットがスーパーセットであるかどうかを判断する
isSuperset
次のようになりますこれら 3 つのケースに基づいて、
数学では、集合について話すときは常に、実行できる演算がいくつかあります。実際には、 Setコード内の
Set
Set を拡張してそのプロパティとメソッドを継承し、それに他のメソッドを追加します。 。
サンプル コードでは、空ではない有効なコレクションであるかどうかを確認するための簡単なメソッドのみが使用されています。
unionclass SetHelper extends Set { /** * 验证集合是否为有效集合 * @param {*} set * @returns */ _isValid = (set) => { return set && set instanceof Set && set.size > 0; }; }Union
##union この操作では、複数の
オブジェクトと結合した結果を返します。実装は、現在のセットと指定されたセットを配列にマージして作成し、新しいセットを返します。 <pre class="brush:php;toolbar:false">union(set) {
if (!this._isValid(set)) return new SetHelper();
return new SetHelper([...this, ...set]);
}</pre>
差異セット
差異
差異 この操作は、1 つのセット要素にのみ含まれる新しいセットを返します。別のセット内にあるものとそうでないもの、つまり差分セットの数学的概念です。
difference(set) { if (!this._isValid(set)) return new SetHelper(); const differenceSet = new SetHelper(); this.forEach((item) => { !set.has(item) && differenceSet.add(item); }); return differenceSet; }
Intersection
intersection
intersection この操作は、両方のコレクションに共通の要素のみを含む新しいコレクションを返します。実装は、小さいコレクションを反復処理して (不必要なチェックを回避し)、各項目が大きいコレクションに存在するかどうかを確認して交差に追加します。交差は、走査の完了後に返されます。
intersection(set) { const intersectionSet = new SetHelper(); if (!this._isValid(set)) return intersectionSet; const [smallerSet, biggerSet] = set.size <= this.size ? [set, this] : [this, set]; smallerSet.forEach((item) => { biggerSet.has(item) && intersectionSet.add(item); }); return intersectionSet; }
対称差分セット
intersectionDifference
##intersectionDifference
この操作は、交差のないすべての要素を含むセットを返します。 2 つのセットの新しいコレクションです。
intersectionDifference(set) { if (!this._isValid(set)) return new SetHelper(); return new SetHelper([ ...this.difference(set), ...set.difference(this), ]); }
サブセット サブセット
isSubset
操作将判断两个集合是否为子集关系(当一个集合的所有项都包含在另一个集合中时)。实现上首先检查两个集合的大小,如果一个集合更大,则它不能是另一个集合的子集,然后对于每个项目,它检查它是否存在于另一个中。
isSubset(set) { if (!this._isValidSet(set)) return false; return ( this.size <= set.size && [...this].every((item) => set.has(item)) ); }
超集 superset
isSuperset
操作将判断两个集合是否为超集关系。超集是子集的反操作。当一个集合包含另一个较小或相等大小的集合的所有项目时,它就是一个超集。
isSuperset(set) { if (!this._isValidSet(set)) return false; return ( this.size >= set.size && [...set].every((item) => this.has(item)) ); }
Set
静态Set
是一个始终包含它初始化元素的集合,不能添加、删除、清除元素。Javascript Set
不是静态的,它总能在创建后可以公开修改该集合的方法,如 add
、delete
,为避免集合被修改,可以创建一个新的 Set
,将其修改方法重置 。
class StaticSet extends SetHelper { constructor(items) { super(items); this.add = undefined; this.delete = undefined; this.clear = undefined; } }
现在就可以使用上面定义的方法操作两个 Set
,如下:
const setA = new StaticSet(new Set([1, 2, 3, 4])); const setB = new StaticSet(new Set([3, 4, 5, 6])); console.log([...setA.union(setB)]); // [ 1, 2, 3, 4, 5, 6 ] console.log([...setA.difference(setB)]); // [ 1, 2 ] console.log([...setA.intersection(setB)]); // [ 3, 4 ] console.log([...setB.intersectionDifference(setA)]); // [ 5, 6, 1, 2 ]
Set
不限于上面这些操作,之前有介绍过可以用来合并数组去重,由于 Set
和 Array
相互转换很简单,因此可以用到 Array
的场合可以优先考虑一下 Set
,因为在内存使用上, Set
比 Array
占用更少。
更多编程相关知识,请访问:编程视频!!
以上がJavaScriptの設定とは何ですか?いつ使用しますか?使い方?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。