オブジェクトの配列をどのように定義できますか?


197

TypeScriptでオブジェクトの配列を作成しています:

 userTestStatus xxxx = {
    "0": { "id": 0, "name": "Available" },
    "1": { "id": 1, "name": "Ready" },
    "2": { "id": 2, "name": "Started" }
 };

型を正しく宣言する方法を誰かに教えてもらえますか?インラインで実行することは可能ですか、それとも2つの定義が必要ですか?

をxxx型宣言に置き換えて、後でTypeScriptでuserTestStatus[3].nammme誤って何かを使用した場合に警告が表示されるようにします。

回答:


279

数値のようなプロパティを持つオブジェクトリテラルの代わりにネイティブ配列を使用するほうがよいので、番号付け(および他の多数の配列関数)は既成の状態で処理されます。

ここで探しているのは、最初に存在するか後で導入されるかに関係なく、配列内のすべての要素を定義する配列のインラインインターフェイス定義です。

let userTestStatus: { id: number, name: string }[] = [
    { "id": 0, "name": "Available" },
    { "id": 1, "name": "Ready" },
    { "id": 2, "name": "Started" }
];

userTestStatus[34978].nammme; // Error: Property 'nammme' does not exist on type [...]

配列を値ですぐに初期化する場合、明示的な型定義は必要ありません。TypeScriptは、最初の割り当てからほとんどの要素タイプを自動的に推測できます。

let userTestStatus = [
    { "id": 0, "name": "Available" },
    ...
];

userTestStatus[34978].nammme; // Error: Property 'nammme' does not exist on type [...]

4
また、あなたは、オブジェクトの配列をこのように宣言することができますlet someArray: Array<{ id: number, name: string }> = []
— アレクサンダーキム・

74

上記は、配列ではなくオブジェクトです。

配列を作成するには[&]を使用してオブジェクトを囲みます。

userTestStatus = [
  { "id": 0, "name": "Available" },
  { "id": 1, "name": "Ready" },
  { "id": 2, "name": "Started" }
];

それとは別に、TypeScriptはJavaScriptのスーパーセットであるため、有効なJavaScriptはすべて有効なTypeScriptになるため、他の変更は必要ありません。

OPからのフィードバックの明確化...投稿されたモデルの定義が必要

ここで定義したタイプを使用して、オブジェクトモデルを表すことができます。

type MyType = {
    id: number;
    name: string;
}

type MyGroupType = {
    [key:string]: MyType;
}

var obj: MyGroupType = {
    "0": { "id": 0, "name": "Available" },
    "1": { "id": 1, "name": "Ready" },
    "2": { "id": 2, "name": "Started" }
};
// or if you make it an array
var arr: MyType[] = [
    { "id": 0, "name": "Available" },
    { "id": 1, "name": "Ready" },
    { "id": 2, "name": "Started" }
];

申し訳ありませんが、私の質問は明確ではありませんでした。私がやりたかったのは、userTestStatusの定義を見つけることでした。

1
@Marilou通常userTestStatus、お気に入りのIDEで変数にカーソルを合わせるだけで定義を取得できます... TypeScriptプレイグラウンドが表示されます{ id: number, name: string; }[]。あなたが好きならインターフェイスでそれを包むことができinterface NameThis { id: number, name: string; }、およびNameThis[]配列型として。
— フェントン

私はこれを試しましたが、それは私にいくつかのエラーを与えます。しかし、私はそれが私が望むようなものだと思います:userTestStatus:{id:number、name:string; } [] = {"0":{"id":0、 "name": "Available"}、 "1":{"id":1、 "name": "Ready"}、

を定義する例ではvar arr: MyType、次のようなプロパティ名/インデックス宣言を使用しません"0": { … }。この時点ではオブジェクトリテラルを使用するだけです。
— gfullam 2016

@gfullamあなたは正しい、私は私の答えを更新しました(それは簡単な不注意な編集でした)
— Brocco

34

一部のtslintルールでは、メッセージの例として[]の使用を無効にしています。Array type using 'T[]' is forbidden for non-simple types. Use 'Array<T>' instead.

次に、次のように記述します。

var userTestStatus: Array<{ id: number, name: string }> = Array(
    { "id": 0, "name": "Available" },
    { "id": 1, "name": "Ready" },
    { "id": 2, "name": "Started" }
);

2
これまでで最も実践的なアプローチ。これは、単純な配列のユースケースに対する単純で直接的なソリューションです。私の+1をとる
— Julio Vedovatto

16

あなたが本当に欲しいものは単に列挙かもしれません

列挙型のように動作するものを探している場合(オブジェクトを定義していて、シーケンシャルID 0、1、2をアタッチしており、スペルミスしたくない名前フィールドが含まれているため(たとえば、名前とnaaame) 、列挙型を定義したほうがよい。シーケンシャルIDは自動的に処理され、型の確認がすぐにできるからだ。

enum TestStatus {
    Available,     // 0
    Ready,         // 1
    Started,       // 2
}

class Test {
    status: TestStatus
}

var test = new Test();
test.status = TestStatus.Available; // type and spelling is checked for you,
                                    // and the sequence ID is automatic

上記の値は自動的にマッピングされます。たとえば、「Available」は「0」になり、次を使用してアクセスできます。 TestStatus.Available。そして、Typescriptはそれらを渡すときに型を強制します。

カスタムタイプの配列として新しいタイプを定義することを主張する場合

オブジェクトの配列(「0」、「1」、「2」のキーを持つオブジェクトとは異なります)が必要なので、まずオブジェクトのタイプを定義してから、それを含む配列のタイプを定義します。

class TestStatus {
    id: number
    name: string

    constructor(id, name){
        this.id = id;
        this.name = name;
    }
}

type Statuses = Array<TestStatus>;

var statuses: Statuses = [
    new TestStatus(0, "Available"),
    new TestStatus(1, "Ready"),
    new TestStatus(2, "Started")
]

申し訳ありませんが、私の質問は明確ではありませんでした。私がやりたかったのは、TypeTestで使用場所を確認できるように、userTestStatusの定義を見つけて、たとえばuserTestStatus [1] .naaaameと入力できないようにすることでした。

「userTestStatus」と「=」の間に挿入するものを見つけたかったのです。変数の型を表すために文字列または数値をそこに置くのと同じ方法で。Broccoのようなものですが、可能であれば1行だけです。

-1

あなたも試すことができます

    interface IData{
        id: number;
        name:string;
    }

    let userTestStatus:Record<string,IData> = {
        "0": { "id": 0, "name": "Available" },
        "1": { "id": 1, "name": "Ready" },
        "2": { "id": 2, "name": "Started" }
    };

レコードの仕組みを確認するには:https : //www.typescriptlang.org/docs/handbook/utility-types.html#recordkt

ここでは、レコードを使用して、キーが文字列で値がIData型のオブジェクトを宣言しているため、プロパティにアクセスしようとするとインテリセンスが提供され、しようとするとタイプエラーがスローされますuserTestStatus [0] .nameeeのようなもの


なぜこれが当面の問題を解決するのかについてより多くの情報を提供する必要があります
— Cornel Raiu
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.