我从对REST服务器的AJAX调用中接收到一个JSON对象。这个对象的属性名与我的TypeScript类相匹配(这是这个问题的后续)。

初始化它的最佳方法是什么?我不认为这将工作,因为类(& JSON对象)的成员是对象的列表和成员是类,而这些类的成员是列表和/或类。

但我更喜欢一种方法,查找成员名和分配他们,创建列表和实例化类的需要,所以我不必为每个类中的每个成员写显式代码(有很多!)


当前回答

我已经创建了一个生成TypeScript接口和运行时“类型映射”的工具,用于对JSON的结果执行运行时类型检查。解析:ts.quicktype.io

例如,给定这个JSON:

{
  "name": "David",
  "pets": [
    {
      "name": "Smoochie",
      "species": "rhino"
    }
  ]
}

quicktype生成以下TypeScript接口和类型映射:

export interface Person {
    name: string;
    pets: Pet[];
}

export interface Pet {
    name:    string;
    species: string;
}

const typeMap: any = {
    Person: {
        name: "string",
        pets: array(object("Pet")),
    },
    Pet: {
        name: "string",
        species: "string",
    },
};

然后检查JSON的结果。根据类型映射解析:

export function fromJson(json: string): Person {
    return cast(JSON.parse(json), object("Person"));
}

我省略了一些代码,但您可以尝试快速输入细节。

其他回答

选项#5:使用Typescript构造函数和jQuery.extend

这似乎是最可维护的方法:添加一个以json结构作为参数的构造函数,并扩展json对象。这样就可以将json结构解析为整个应用程序模型。

不需要创建接口,或者在构造函数中列出属性。

export class Company
{
    Employees : Employee[];

    constructor( jsonData: any )
    {
        jQuery.extend( this, jsonData);

        // apply the same principle to linked objects:
        if ( jsonData.Employees )
            this.Employees = jQuery.map( jsonData.Employees , (emp) => {
                return new Employee ( emp );  });
    }

    calculateSalaries() : void { .... }
}

export class Employee
{
    name: string;
    salary: number;
    city: string;

    constructor( jsonData: any )
    {
        jQuery.extend( this, jsonData);

        // case where your object's property does not match the json's:
        this.city = jsonData.town;
    }
}

在你的ajax回调中,你收到一个公司来计算工资:

onReceiveCompany( jsonCompany : any ) 
{
   let newCompany = new Company( jsonCompany );

   // call the methods on your newCompany object ...
   newCompany.calculateSalaries()
}

这是我的方法(非常简单):

const jsonObj: { [key: string]: any } = JSON.parse(jsonStr);

for (const key in jsonObj) {
  if (!jsonObj.hasOwnProperty(key)) {
    continue;
  }

  console.log(key); // Key
  console.log(jsonObj[key]); // Value
  // Your logic...
}

JQuery .extend为你做这个:

var mytsobject = new mytsobject();

var newObj = {a:1,b:2};

$.extend(mytsobject, newObj); //mytsobject will now contain a & b

我发现最适合这个目的的是类转换器

这就是它的用法:

一些类:

export class Foo {

    name: string;

    @Type(() => Bar)
    bar: Bar;

    public someFunction = (test: string): boolean => {
        ...
    }
}

// the docs say "import [this shim] in a global place, like app.ts" 
import 'reflect-metadata';

// import this function where you need to use it
import { plainToClass } from 'class-transformer';

export class SomeService {

  anyFunction() {
    u = plainToClass(Foo, JSONobj);
  }
}

如果使用@Type装饰器,也会创建嵌套属性。

也许不现实,但简单的解决方案:

interface Bar{
x:number;
y?:string; 
}

var baz:Bar = JSON.parse(jsonString);
alert(baz.y);

对困难的依赖也要努力!!