web-dev-qa-db-ja.com

TypeScriptインターフェイスプロパティのタイプを「抽出」する方法はありますか？

いくつかのインターフェースを含むライブラリXのタイピングファイルがあるとします。

interface I1 {
    x: any;
}

interface I2 {
    y: {
        a: I1,
        b: I1,
        c: I1
    }
    z: any
}

このライブラリを使用するには、I2.yとまったく同じ型のオブジェクトを渡す必要があります。もちろん、ソースファイルに同じインターフェイスを作成できます。

interface MyInterface {
    a: I1,
    b: I1,
    c: I1
}

let myVar: MyInterface;

しかし、その後、ライブラリのライブラリを最新の状態に保つという負担がかかります。さらに、非常に大きくなり、多くのコードの重複が発生する可能性があります。

したがって、インターフェイスのこの特定のプロパティのタイプを「抽出」する方法はありますか？ let myVar: typeof I2.yに似たもの（機能せず、「名前I2が見つかりません」というエラーが発生します）。前もって感謝します。

編集：TS Playgroundで少し遊んだ後、次のコードがまさに私がしたいことを達成していることに気付きました：

declare var x: I2;
let y: typeof x.y;

ただし、冗長変数xを宣言する必要があります。その宣言なしでこれを達成する方法を探しています。

typescripttypingdefinitelytyped
46
Kuba Jagoda

以前は不可能でしたが、幸いなことに TypeScriptバージョン2.1 であるためです。 2016年12月7日にリリースされ、ルックアップタイプとも呼ばれるインデックス付きアクセスタイプが導入されました。

構文は要素アクセスとまったく同じように見えますが、型の代わりに記述されています。あなたの場合：

interface I1 {
    x: any;
}

interface I2 {
    y: {
        a: I1,
        b: I1,
        c: I1
    }
    z: any
}

let myVar: I2['y'];  // indexed access type

myVarのタイプはI2.y。

TypeScript Playground で確認してください。

87
Michał Miszczyszyn

インターフェイスは、オブジェクトの定義に似ています。 yは、I2オブジェクトのプロパティであり、特定のタイプ（その場合は「匿名」）です。

別のインターフェイスを使用してyを定義し、このようにyタイプとして使用できます

interface ytype {
   a: I1;
   b: I1;
   c: I1;
}

interface I2 {
    y: ytype;
    z: any;
}

インターフェイスをファイルに入れて抽出を使用すると、プロジェクトの他のファイルにインポートできます

export interface ytype {
   a: I1;
   b: I1;
   c: I1;
}



 export interface I2 {
        y: ytype;
        z: any;
    }

その方法でインポートできます：

   import {I1, I2, ytype} from 'your_file'
0
JCorriveau