アプリケーションを構(gòu)築するとき、特に大規(guī)模なデータセットやリアルタイム要件を扱う場(chǎng)合、パフォーマンスが鍵となるか、少なくとも重要な推進(jìn)力になることがあります。 JavaScript での最も一般的なタスクの 1 つは、コレクションに値が存在するかどうかを確認(rèn)することです。最もよく使用される 2 つの代替手段は、Array.includes() と Set.has() です。どちらも機(jī)能しますが、実際には Set.has() の方が Array.includes よりも機(jī)能します。この理由を詳しく調(diào)べて、どちらかの代替手段をいつ使用するべきかを判斷しましょう。

Array.includes() と Set.has() の理解

使用方法は非常に簡(jiǎn)単に見えますが、実裝が異なる 2 つのメソッド、つまり Array.includes() と Set.has() があります。

Array.includes()

includes() メソッドは、指定された値が配列內(nèi)に存在するかどうかを確認(rèn)します。
O(n) の時(shí)間計(jì)算量を利用しており、配列の長(zhǎng)さが長(zhǎng)いほど値のチェックにかかる時(shí)間が長(zhǎng)くなります。
これは、Array.includes() が配列を最初から最後まで (または値が見つかるまで) 検索し、配列が大きくなるほど時(shí)間がかかるためです。

Set.has()

Set の has() メソッドは、指定された値が存在するかどうかもチェックしますが、はるかに高速に実行されます。
Set.has() は、定數(shù)時(shí)間のルックアップ、つまり O(1) 時(shí)間の計(jì)算量を可能にするハッシュ テーブル ベースの構(gòu)造に依存しています。
配列とは異なり、set は一意の値を処理するように構(gòu)築されているため、內(nèi)部に重複した値が含まれず、検索時(shí)間が長(zhǎng)くなります。

大規(guī)模なデータセットでは Set.has() の方が高速な理由

Set.has() を使用すると、セット內(nèi)の項(xiàng)目の數(shù)に関係なく、JavaScript は 1 回の直接操作で項(xiàng)目を見つけることができます。たとえば、値が 100 萬(wàn)を含むセット內(nèi)にあるかどうかをチェックする場(chǎng)合、Set.has() にかかる時(shí)間は 10 をチェックする場(chǎng)合とまったく同じになります。

一方、Array.includes() は、目的の項(xiàng)目が見つかるか、最後に到達(dá)するまで、各要素を左から右に順番に調(diào)べます。つまり、サイズが長(zhǎng)くなるほど、特に終わりに近いアイテムの場(chǎng)合や、問(wèn)題のアイテムがそこにない場(chǎng)合には、チェックに時(shí)間がかかることになります。

例を詳しく見てみましょう:

const bigArray = Array.from({ length: 1000000 }, (_, i) => i);
const bigSet = new Set(bigArray);

const valueToFind = 999999;

// Array.includes (O(n)) - Slower for large arrays
console.time("Array.includes");
bigArray.includes(valueToFind);
console.timeEnd("Array.includes");

// Set.has (O(1)) - Faster for large sets
console.time("Set.has");
bigSet.has(valueToFind);
console.timeEnd("Set.has");

これを?qū)g行すると、大規(guī)模な配列では Set.has() が Array.includes() よりもはるかに優(yōu)れたパフォーマンスを発揮することがわかります。実際には、その違いはアニメーションのスムーズ化、読み込み時(shí)間の短縮、またはサーバー上のリソース使用量の削減につながる可能性があります。

Set.has() と Array.includes() を使用する場(chǎng)合

これはすべて、あなたが何を達(dá)成しようとしているかによって異なります。簡(jiǎn)単な概要は次のとおりです:

次の場(chǎng)合は Set.has() を使用します。

• あなたはビッグデータを扱っており、多くの検索を行っています。
• 一意のユーザー ID、タグ、キーワードのセットなどの一意の値を操作しています。
• 配列を
に変換するための初期費(fèi)用が少額であっても気にする必要はありません。
• 後で検索の數(shù)を最小限に抑えるように設(shè)定します。

次の場(chǎng)合は Array.includes() を使用します。

• データセットは小さいため、パフォーマンスの差は無(wú)視できます。
• 項(xiàng)目を確認(rèn)する必要があるのは 1 回か數(shù)回だけであるため、セットを作成するメリットはありません。
• セットでは処理できない重複を扱っています。

使用例

ブロックされた単語(yǔ)のリストに対して名前をフィルターするユーザー検索機(jī)能を?qū)g裝していると想像してください。ブロックされている?yún)g語(yǔ)が何百もあり、頻繁に検索している場(chǎng)合は、ブロックされている?yún)g語(yǔ)にセットを使用すると、各検索チェックを高速化できます。

const bigArray = Array.from({ length: 1000000 }, (_, i) => i);
const bigSet = new Set(bigArray);

const valueToFind = 999999;

// Array.includes (O(n)) - Slower for large arrays
console.time("Array.includes");
bigArray.includes(valueToFind);
console.timeEnd("Array.includes");

// Set.has (O(1)) - Faster for large sets
console.time("Set.has");
bigSet.has(valueToFind);
console.timeEnd("Set.has");

小規(guī)模なケースであっても、セットは物事を効率的かつ予測(cè)可能に保つのに役立ちます。さらに、ブロックされる?yún)g語(yǔ)のリストが増えても、スケーラブルなソリューションがすでに用意されています。

重要なポイント

• パフォーマンス: Set.has() は O(1) の時(shí)間計(jì)算量を提供し、大規(guī)模なコレクションの場(chǎng)合は O(n) の Array.includes() よりもはるかに高速になります

• 適合性: セットは一意の値用に設(shè)計(jì)されているため、検索用に自然に最適化されます。配列は重複値に対してより柔軟ですが、存在のチェックが遅くなります。

• スケーラビリティ: データが増加すると、Set.has() は引き続き良好なパフォーマンスを示しますが、Array.includes() は遅くなります。

最終的な考え

Set.has() と Array.includes() のどちらかを選択する場(chǎng)合は、データセットのサイズと性質(zhì)を理解しておくことが常に重要です。 Array.includes() は小さなデータセットにはまったく問(wèn)題ありませんが、速度が重要な狀況では Set.has() が貴重なツールです。適切なデータ構(gòu)造は、コードに大きな変更を加えることなく、JavaScript アプリケーションを最適化してより高速かつ効率的にするのに役立ちます。

したがって、そこに何かがあるかどうかを確認(rèn)していることに気づいたときは、常に自問(wèn)する必要があります。「それは配列の仕事なのか、それともセットの力を利用できるのか?」これを正しく行うことで、アプリケーションに必要な違いが得られる可能性があります。

以上がSet.has() が Array.includes() よりも項(xiàng)目の検索が速い理由の詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。