将 JSON 解析为多个 Typescript 对象答案

【问题标题】：Parse JSON to multiple Typescript objects将 JSON 解析为多个 Typescript 对象
【发布时间】：2021-05-15 05:03:04
【问题描述】：

我知道已经有多个关于在 Typescript 中解析 JSON 文件的问题，但没有一个对我有帮助。

我正在尝试解析许可证检查器输出的结果，它是一个 json：

{
  "@angular/core@10.1.4": {
    "licenses": "MIT",
    "repository": "https://github.com/angular/angular",
    "publisher": "angular",
    "name": "@angular/core",
    "version": "10.1.4",
    "description": "Angular - the core framework",
    "licenseFile": "C:\\Users\\UC190\\workspace\\core-search-app\\node_modules\\@angular\\core\\README.md",
    "licenseText": "Angular\n=======\n\nThe sources for this package are in the main [Angular](https://github.com/angular/angular) repo. Please file issues and pull requests against that repo.\n\nUsage information and reference details can be found in [Angular documentation](https://angular.io/docs).\n\nLicense: MIT",
    "path": "C:\\Users\\UC190\\workspace\\core-search-app\\node_modules\\@angular\\core"
  },
  "@angular/forms@10.1.4": {
    "licenses": "MIT",
    "repository": "https://github.com/angular/angular",
    "publisher": "angular",
    "name": "@angular/forms",
    "version": "10.1.4",
    "description": "Angular - directives and services for creating forms",
    "licenseFile": "C:\\Users\\UC190\\workspace\\core-search-app\\node_modules\\@angular\\forms\\README.md",
    "licenseText": "Angular\n=======\n\nThe sources for this package are in the main [Angular](https://github.com/angular/angular) repo. Please file issues and pull requests against that repo.\n\nUsage information and reference details can be found in [Angular documentation](https://angular.io/docs).\n\nLicense: MIT",
    "path": "C:\\Users\\UC190\\workspace\\core-search-app\\node_modules\\@angular\\forms"
  },
  ...
}

因此我创建了一个接口来解析元素：

export interface JsonData {
  licenses: string;
  repository: string;
  publisher: string;
  name: string;
  version: string;
  description: string;
  licenseFile: string;
  licenseText: string;
  path: string;
}

但我正在努力解决如何迭代元素并将它们解析为JsonData 的列表。

【问题讨论】：

标签： json typescript parsing

【解决方案1】：

TypeScript 中的接口允许您描述数据结构的形状（不过，这不是它们的唯一目的）。在您的情况下，数据结构是一个映射，以包名称为键，对应的值是包/许可证详细信息。

考虑以下接口...

interface Package {
  licenses: string;
  repository: string;
  publisher: string;
  name: string;
  version: string;
  description: string;
  licenseFile: string;
  licenseText: string;
  path: string;
}

interface PackageMap {
  [key:string]: Package
}

您可以通过以下方式测试您是否可以获得密钥及其对应的值...

const data: PackageMap = JSON.parse(json); // Assume json refers to your data structure
const keys: string[] = Object.keys(data);

keys.forEach(key => console.log(key, data[key]));

【讨论】：

【解决方案2】：

好的，我知道了如何处理这个问题。

我可以遍历包含值的对象

for (const value of Object.values(data)) {
  this.dataSource.data.push(this.encodeLicenseData(value));
}

并在encodeLicenseData() 函数中将值解析为我需要的值。

【讨论】：