TypeScript でオブジェクトにプロパティを動的に割り当てるにはどうすればいいですか? 質問する

TypeScript でオブジェクトにプロパティを動的に割り当てるにはどうすればいいですか? 質問する

Javascript でオブジェクトにプログラム的にプロパティを割り当てたい場合は、次のようにします。

var obj = {};
obj.prop = "value";

しかし、TypeScript では、次のエラーが発生します。

プロパティ 'prop' はタイプ '{}' の値に存在しません

TypeScript でオブジェクトに新しいプロパティを割り当てるにはどうすればよいですか?

ベストアンサー1

インデックス署名

objを と表記することもできますanyが、それではTypeScriptを使用する目的が台無しになってしまいます。は をobj = {}意味します。 と表記しても意味がありません。 望ましい一貫性を実現するために、インターフェースは次のように定義できます。objObjectanyインデックス署名

interface LooseObject {
    [key: string]: any
}

var obj: LooseObject = {};

または、コンパクトにするには:

var obj: {[k: string]: any} = {};

LooseObject任意の文字列をキーとして、any型を値として持つフィールドを受け入れることができます。

obj.prop = "value";
obj.prop2 = 88;

このソリューションの本当の優れた点は、インターフェースにタイプセーフなフィールドを含めることができることです。

interface MyType {
    typesafeProp1?: number,
    requiredProp1: string,
    [key: string]: any
}

var obj: MyType ;
obj = { requiredProp1: "foo"}; // valid
obj = {} // error. 'requiredProp1' is missing
obj.typesafeProp1 = "bar" // error. typesafeProp1 should be a number

obj.prop = "value";
obj.prop2 = 88;

Record<Keys,Type>ユーティリティタイプ

更新(2020年8月):@transangがRecord<Keys,Type>ユーティリティタイプコメント欄

Record<Keys,Type>はTypescriptのユーティリティ型です。プロパティ名が不明なキーと値のペアのよりクリーンな代替手段です。は、およびがジェネリックである名前付きエイリアスであることは注目に値します。私見Record<Keys,Type>では、これはここで言及する価値があります。{[k: Keys]: Type}KeysType

比較すると、

var obj: {[k: string]: any} = {};

なる

var obj: Record<string,any> = {}

MyTypeレコード型を拡張することで定義できるようになりました

interface MyType extends Record<string,any> {
    typesafeProp1?: number,
    requiredProp1: string,
}

これは元の質問に対する答えですが、答えはここ@GreeneCreations による記事は、問題へのアプローチ方法について別の視点を与えてくれるかもしれません。

おすすめ記事