1. ホーム
  2. typescript

[解決済み] TypeScriptでオブジェクトに動的にプロパティを割り当てるには?

2022-03-15 22:25:31

質問

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

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

しかし、TypeScriptでは、これはエラーが発生する。

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

TypeScriptでオブジェクトに新しいプロパティを割り当てるにはどうしたらいいのでしょうか?

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

インデックスの種類

を表記することができます。 obj として any しかし、それではtypescriptを使う意味がありません。 obj = {} を意味します。 objObject . としてマークする any は意味をなさない。望ましい一貫性を実現するために、次のようなインターフェイスを定義することができる。

interface LooseObject {
    [key: string]: any
}

var obj: LooseObject = {};

ORでコンパクトにする。

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> はtypescriptのUtility型である。これは,プロパティ名がわからないKey-Valueペアのための,よりクリーンな代替手段である. 注目すべきは Record<Keys,Type> の名前付きエイリアスです。 {[k: Keys]: Type} ここで KeysType はジェネリックです。 IMOでは、これはここで言及する価値があります。

比較のために

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

になる

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

MyType を拡張して定義することができるようになりました。

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

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