如何在 TypeScript 中聲明具有嵌套對象數組的 object？

Question

我有兩個這樣的課程。

class Stuff {
  constructor() { }
  things: Thing[] = [];
  name: string;
}

class Thing {
  constructor() { }
  active: boolean;
}

我試圖像這樣在我的應用程序中聲明一個字段。

blopp: Stuff[] = [
  {name: "aa", things: null}, 
  {name: "bb", things: null}];

上述方法工作得很好。 但是，當我嘗試提供一系列事物而不是 null 時，我收到錯誤消息，即它不能分配給指定的類型。

blopp: Stuff[] = [
  {name: "aa", things: [{active: true}, {active: false}]}, 
  {name: "bb", things: null}];

Answer 1

您應該使用new關鍵字實例化您的對象：

class Stuff {
    constructor(public name: string, public things: Thing[] = []) { }
}

class Thing {
    constructor(public active: boolean) {

    };
}

var blopp: Stuff[] = [
    new Stuff("aa", [new Thing(true), new Thing(false)]),
    new Stuff("bb", null)
];

或者簡單地使用接口：

interface IThing {
    active: boolean
}

interface IStuff {
    name: string;
    things: IThing[]
}

var blopp: IStuff[] = [
    { name: "aa", things: [{ active: true }, { active: false }] },
    { name: "bb", things: null }];

確定是否需要類或接口很重要，因為某些事情不適用於匿名對象：

 /* class Stuff { constructor(public name: string, public things: Thing[] = []) { } } class Thing { constructor(public active: boolean) { }; } var blopp: Stuff[] = [ { name: "aa", things: [{ active: true }, { active: false }] }, new Stuff("bb", null) ]; console.log("Is blopp[0] Stuff:", blopp[0] instanceof Stuff); console.log("Is blopp[1] Stuff:", blopp[1] instanceof Stuff); */ var Stuff = (function () { function Stuff(name, things) { if (things === void 0) { things = []; } this.name = name; this.things = things; } return Stuff; }()); var Thing = (function () { function Thing(active) { this.active = active; } ; return Thing; }()); var blopp = [ { name: "aa", things: [{ active: true }, { active: false }] }, new Stuff("bb", null) ]; console.log("Is blopp[0] Stuff:", blopp[0] instanceof Stuff); console.log("Is blopp[1] Stuff:", blopp[1] instanceof Stuff); 

Answer 2

嘗試使用<>或as關鍵字進行投射：

blopp: Stuff[] = [
  {name: "aa", things: [{active: true} as Thing , {active: false}as Thing]}, 
  {name: "bb", things: null}];
}

要么

blopp: Stuff[] = [
  {name: "aa", things: [<Thing>{active: true}  , <Thing>{active: false}]}, 
  {name: "bb", things: null}];
}

Answer 3

除了接受的答案當然是正確的之外，如果您確實想使用接口，您可以在如下接口中定義 go 的接口：

interface IFurniture {
  name: string
  legs: number
}

interface IRoom {
  name: string
  furniture: IFurniture[]
}

interface IHouse {
  rooms: IRoom[]
}

如果您不需要命名嵌套部件的類型，則可以嵌套接口定義：

interface IHouse {
  rooms: {
    name: string
    furniture: {
      name: string
      legs: number
    }[]
  }[]
}

這些定義IHouse接口的方法中的任何一種都將嚴格鍵入如下所示的房屋定義：

let house: IHouse = {
  rooms: [
    {
      name: "kitchen",
      furniture: [
        { 
          name: "chair",
          legs: 4
        },
        { 
          name: "stool",
          legs: 3
        }
      ]
    },
    {
      name: "bedroom",
      furniture: []
    }
  ]
}