JavaScript で Set() を使用して一意の配列を作成します。

この記事では、TypeDoc のコード リファレンスにヒントを得て、JavaScript の新しいセットを使用して一意の配列を作成する方法を分析します。

まず、上の画像にあるこのユニークな関数を例を挙げて理解しましょう。次に、これが TypeDoc ソース コードでどのように使用されるかを見ていきます。

独自の機能

export function unique<T>(arr: Iterable<T> | undefined): T[] {
    return Array.from(new Set(arr));
}

この関数は typedoc/src/lib/utils/array.ts から選択されます。

Array.from 静的メソッドは、反復可能なオブジェクトまたは配列のようなオブジェクトから、浅くコピーされた新しい Array インスタンスを作成します。

Array.from() を使用すると、以下から配列を作成できます:

• 反復可能なオブジェクト (Map や Set などのオブジェクト);または、オブジェクトが反復可能でない場合は、

• 配列のようなオブジェクト (長さプロパティとインデックス付き要素を持つオブジェクト)。

ブラウザのコンソールで以下のコードを実行すると、Set によって重複した値が削除されることがすぐにわかります。

new Set([1,2,3,1,2,5,4,3,])
// result: Set(5) {1, 2, 3, 5, 4}

これら 2 つの概念を組み合わせることで、new Set() を使用して、シンプルかつ簡単に独自の配列を作成できるようになりました。

TypeDoc が独自の関数を使用する方法

TypeDoc は、L366 で独自の関数を lib/application.ts にインポートします。

この Stackoverflow の回答にも同様のアプローチの提案があります。

const unique = (list) => {
  return [...new Set(list)];
}

これは Stackoverflow から選択され、Array.from メソッドの代わりにスプレッド演算子を使用します。

私たちについて:

Think Throo では、オープンソース プロジェクトで使用される高度なコードベース アーキテクチャの概念を教えることを使命としています。

Next.js/React の高度なアーキテクチャ概念を実践してコーディング スキルを 10 倍にし、ベスト プラクティスを学び、実稼働レベルのプロジェクトを構築します。

私たちはオープンソースです — https://github.com/thinkthroo/thinkthroo (スターを付けてください!)

当社では、Web 開発およびテクニカル ライティング サービスも提供しています。詳細については、hello@thinkthroo.com までお問い合わせください。

参考文献:

1. https://github.com/TypeStrong/typedoc/blob/master/src/lib/application.ts#L366

2. https://github.com/TypeStrong/typedoc/blob/master/src/lib/utils/array.ts#L98C8-L100C2

3. https://stackoverflow.com/questions/6940103/how-do-i-make-an-array-with-unique-elements-i-e-remove-duplicates

4. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from

以上がJavaScript で Set() を使用して一意の配列を作成します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。