Typescript JSON字符串到類

Question

讓這個JSON字符串：

[
    {
        "id": 1,
        "text": "Jon Doe"
    },
    {
        "id": 1,
        "text": "Pablo Escobar"
    }
]

讓我們上課：

export class MyObject{
    id: number;
    text: string;
}

如何將此JSON字符串轉換為MyObject列表？

如果我做：

console.log(<MyObject[]>JSON.parse(json_string));

它返回Object列表而不是MyObject列表

Answer 1

你不一定需要這里的課程。 你可以使用一個界面

export interface MyObject{
  id: number;
  text: string;
}

然后你可以寫：

var myObjArray : MyObject[] =  [
  {
    "id": 1,
    "text": "Jon Doe"
  },
  {
    "id": 1,
    "text": "Pablo Escobar"
  }
];

如果您的數據來自服務器，您可能會將其放在any類型的變量中，您可以將其分配給該類型的數組，它將按預期工作。

var data: any = getFromServer();
var myObjectArray:MyObject[] = data;

在typescript中，您不需要實現接口的類。 任何滿足接口契約的對象文字都可以。

如果您的數據仍然是字符串，則可以使用JSON.parse(jsonString)將字符串解析為JavaScript對象。

在這里看操場

Answer 2

您需要為您的類創建一個構造函數，並為您收到的列表中的每個項目調用它。

export class MyObject{
    constructor(public id: number, public text: string) { }
}

let data = [
  {
    "id": 1,
    "text": "Jon Doe"
  },
  {
    "id": 1,
    "text": "Pablo Escobar"
  }
];

let objects = data.map(o => new MyObject(o.id, o.text));

你可以在這里的游樂場看看。

Answer 3

MyObject有50個或更多屬性時出現問題...

在MyObject類中添加一個構造函數，以便它擴展您的json對象。

export class MyObject {
    constructor( json: any )
    {
      $.extend(this, json);
    }
    id : number;
    text : string;

    methodOnMyObject() {...}
}

在你的ajax回調中，從你的json對象創建MyObject對象：

let newObject = new MyObject( json );
newObject.methodOnMyObject();

我詳細介紹了該帖子中的解決方案。

Answer 4

實現這一目標的另一種方法：

var data: any = getFromServer();
var myObjectArray = data as MyObject;

要么：

var data: any = getFromServer();
var myObjectArray = <MyObject>dataMyObject;