Typescript JSON 字符串到类

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/40171620/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 03:56:43  来源:igfitidea点击:

Typescript JSON string to class

jsonobjecttypescriptcasting

提问by Ben

Let be this JSON string:

让这个 JSON 字符串:

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

Let be this class:

让这个班级:

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

How can I cast this JSON string to list of MyObject?

如何将此 JSON 字符串转换为列表MyObject

If I do:

如果我做:

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

It returns a list of Objectinstead of a list of MyObject

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

回答by Titian Cernicova-Dragomir

You don't necessarily need a class here. You can just use an interface

你不一定需要在这里上课。你可以只使用一个接口

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

Then you can just write:

然后你可以写:

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

If you data comes from the server, you will probably have it in a variable of type any, and you can just assign it to an array of that type and it will work as expected.

如果您的数据来自服务器,您可能会将它放在 any 类型的变量中,您只需将其分配给该类型的数组,它就会按预期工作。

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

In typescript you don't need a class implementing an interface. Any object literal that satisfies the interface contract will do.

在打字稿中,您不需要实现接口的类。任何满足接口契约的对象文字都可以。

If your data is still in string for you can just use JSON.parse(jsonString)to parse the string to JavaScript objects.

如果您的数据仍然在字符串中,您可以使用JSON.parse(jsonString)将字符串解析为 JavaScript 对象。

See playground here

这里的游乐场

回答by toskv

You will need to create a constructor for your class, and call it for each item in the list you receive.

您需要为您的类创建一个构造函数,并为您收到的列表中的每个项目调用它。

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));

You can check it out in the playground here.

您可以在此处的操场上查看

回答by Anthony Brenelière

There is a problem when MyObject has 50 or more properties...

当 MyObject 有 50 个或更多属性时出现问题...

Add a constructor in your MyObject class so that it extends your json object.

在 MyObject 类中添加一个构造函数,以便它扩展您的 json 对象。

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

    methodOnMyObject() {...}
}

In your ajax callback, create the MyObject object from your json Object:

在您的 ajax 回调中,从您的 json 对象创建 MyObject 对象:

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

I detailed the solution in that post.

我在那篇文章中详细介绍了解决方案。

回答by OlegI

One more way to achieve this:

实现这一目标的另一种方法:

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

Or:

或者:

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