1. ホーム
  2. typescript

TypeScriptで配列の項目を見つけるには?(現代的で簡単な方法)

2023-09-28 09:03:28

質問

TypeScriptで配列の中の項目を検索する正規の方法はありますか?

ES6+ではこのようなシンプルでクリーンなアプローチが可能です。

[{"id":1}, {"id":-2}, {"id":3}].find(myObj => myObj.id < 0)  // returns {"id":-2}

TypeScriptは多くのES6+の機能を実装しており、今後もそうしていく予定です。少なくとも同じくらい素晴らしい解決策を持っている可能性が高いと思われますので。

使いやすさ、最新のベストプラクティス、シンプルさによるエレガンスを考慮すると、TypeScriptを使用して配列から項目を見つけるにはどうしたらよいでしょうか。

(最良のアプローチを探すために質問を少し言い直します)

ノート

  • " 項目 はJavaScriptのオブジェクトであったり、他のほとんどのものであったりします。 上記の例では、たまたま普通のネイティブJSオブジェクトを見つけることができましたが、多くのシナリオが存在します。

  • " 正規 は、コンピュータサイエンス(および他の分野)では、「一般に認められた規則または標準的な式」と言うための単なる空想的な方法です(ここの誰もが、ある時点でそれを知らなかったことを覚えておいてください)。

  • これは新機能についてではありません . JS のどのバージョンでもこれを行うことができました。しかし、そうするためのフォームは、時間を遡れば遡るほど魅力的ではなくなります。

  • TypeScriptロードマップ を参考にしてください。

どのように解決するのですか?

第一部 - ポリフィル

まだ実装していないブラウザのために、ポリフィルを使った array.find . MDN の提供 .

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    if (this == null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;

    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

パート2 - インターフェース

オープン配列のインターフェイスを拡張し、その中に find メソッドを追加する必要があります。

interface Array<T> {
    find(predicate: (search: T) => boolean) : T;
}

これがTypeScriptに届くと、コンパイラから警告が出て、これを削除するように注意されます。

第三部 - 使ってみよう

変数 x は期待通りの型になります... { id: number }

var x = [{ "id": 1 }, { "id": -2 }, { "id": 3 }].find(myObj => myObj.id < 0);