网站搜索

javascript - 使用 Typescript 将嵌套的 Json 反序列化为类


我有以下 JSON:

{
  "Setting": {
    "IsYear": true
  },
  "Durations": [
    {
      "Value": "100000000",
      "Duration": 1
    },
    {
      "Value": "100000001",
      "Duration": 2
    },
    {
      "Value": "100000002",
      "Duration": 3
    },
    {
      "Value": "100000003",
      "Duration": 5
    },
    {
      "Value": "100000004",
      "Duration": 0
    },
    {
      "Value": "100000005",
      "Duration": 8
    },
    {
      "Value": "100000006",
      "Duration": 10
    }
  ]
}

我目前的课程:

class Durations {
    IsYear = false;
    Durations = [];
}

以及反序列化:

let obj: MyObj = JSON.parse(jsonContent);

我实际上在反序列化以及访问结果对象中的值时遇到了困难。

请有人向我展示如何使用 TypeScript 正确地将上述 JSON 反序列化为相应的类,以及如何访问这些值吗?

任何帮助都将不胜感激。

答案#1

一种解决方案是实现序列化和反序列化方法。

我的例子是手动的。

const serializedObj: string = JSON.stringify({
  "Setting": {
    "IsYear": true
  },
  "Durations": [
    {
      "Value": "100000000",
      "Duration": 1
    },
    {
      "Value": "100000001",
      "Duration": 2
    },
    {
      "Value": "100000002",
      "Duration": 3
    },
    {
      "Value": "100000003",
      "Duration": 5
    },
    {
      "Value": "100000004",
      "Duration": 0
    },
    {
      "Value": "100000005",
      "Duration": 8
    },
    {
      "Value": "100000006",
      "Duration": 10
    }
  ]
});

interface MyObjType {
  Setting: {
    IsYear: boolean;
  };

  Durations: {
    Value: string;
    Duration: number;
  }[];
}

class MyObj {
  protected IsYear: MyObjType['Setting']['IsYear'] = false;
  protected Durations: MyObjType['Durations'] = [];

  public serialize(): string {
    return JSON.stringify({
      Setting: {
        IsYear: this.IsYear,
      },

      Durations: this.Durations,
    } as MyObjType);
  }

  public deserialize(serializedObj: string): void {
    const obj: MyObjType = JSON.parse(serializedObj);

    this.IsYear = obj.Setting.IsYear;
    this.Durations = obj.Durations;
  }
}

// --- Test

const obj = new MyObj();

obj.deserialize(serializedObj);

console.log(obj.serialize());

代码片段