使用打字稿接口与递归JSON

Question

我正在尝试使用JSON调整产品的本体及其属性。下面提到的JSON结构是什么，我想。

每个产品（概念）都有两种类型的属性：1.数据属性2.对象属性

使用Protege时，这些属性的典型定义如下^{SO Thread}：

在Protégé中，有用于创建对象属性和数据类型属性的不同选项卡。如果属性应将个人与个人相关联，则它必须是对象属性，而如果将个人与文字相关联，则它必须是数据类型属性。

我认为每个属性都具有以下属性：

name: string
url: string
type: dataprop or objprop
objPropSource: available only for Objproperties

我已经绘制了一个小的递归JSON，如下所示：

{
  "name": "chair",
  "url": "http://namespace.org#chair",
  "type": "main",
  "properties": [
    {
      "name": "height",
      "url": "http://namespace.org#height",
      "type": "dataprop"
    },
    {
      "name": "width",
      "url": "http://namespace.org#width",
      "type": "dataprop"
    },
    {
      "name": "horizontalsurface",
      "url": "http://namespace.org#horizontalsurface",
      "type": "objprop",
      "objPropSource": "http://namespace.org#hasHorizontalSurface",
      "properties": [
        {
          "name": "Legislation",
          "url": "http://namespace.org#legislation",
          "type": "objprop",
          "objPropSource": "http://namespace.org#compliesWithLegislation",
          "properties": [
            {
              "name": "hasLegislationName",
              "url": "http://namespace.org#hasLegislationName",
              "type": "dataprop"
            }
            ]
        }
        ]
    },
    {
      "name": "legislation",
      "url": "http://namespace.org#legislation",
      "type": "objprop",
      "objPropSource": "http://namespace.org#compliesWithLegistion",
      "properties": [
        {
          "name": "hasLegislationName",
          "url": "http://namespace.org#hasLegislationName",
          "type": "dataprop"
        }
        ]
    }
  ]
}

在某种程度上结构提供一个二叉树对于具有椅子height，width等，如dataproperties和horizontalsurface和legislation作为objectproperties

JSON到Typescript中的接口

我使用JSON到TS Online Converter查看如何将JSON转换为Typescript接口，结果如下：

interface RootObject {
  name: string;
  url: string;
  type: string;
  properties: Property3[];
}

interface Property3 {
  name: string;
  url: string;
  type: string;
  objPropSource?: string;
  properties?: Property2[];
}

interface Property2 {
  name: string;
  url: string;
  type: string;
  objPropSource?: string;
  properties?: Property[];
}

interface Property {
  name: string;
  url: string;
  type: string;
}

推理

我推断使用递归JSON接口的方法是不可扩展的，因为这种产品本体可以扩展到多达1000个属性和属性中的属性。如上述示例所示，对于父属性中的每个属性，都将继续创建接口。

期望

我应该使用具有这种JSON结构的Typescript接口还是应该坚持创建类，然后遵循创建二叉树的常规方法来创建。

export class leaf {
  name: string;
  url: string;
  type: string;
  children: leaf[] = [];
}

然后编写递归，直到解析出完整的结构？

TL; DR

Typescript接口可以用于大型递归JSON结构吗？

Answer 1

您应该能够将该结构很好地表示为递归接口：

interface Property {
  name: string;
  url: string;
  type: string;
  objPropSource?: string;
  properties?: Property[];
}

您尝试使用的JSON至TS转换器似乎没有识别结构递归性质的功能。

工作示例：

interface Property {
  name: string;
  url: string;
  type: string;
  objPropSource?: string; // optional property
  properties?: Property[];
};

var p: Property = JSON.parse(getJson());

alert(p.properties[2].properties[0].name);
alert(p.properties[3].objPropSource);




function getJson() {
  return `{
  "name": "chair",
  "url": "http://namespace.org#chair",
  "type": "main",
  "properties": [
    {
      "name": "height",
      "url": "http://namespace.org#height",
      "type": "dataprop"
    },
    {
      "name": "width",
      "url": "http://namespace.org#width",
      "type": "dataprop"
    },
    {
      "name": "horizontalsurface",
      "url": "http://namespace.org#horizontalsurface",
      "type": "objprop",
      "objPropSource": "http://namespace.org#hasHorizontalSurface",
      "properties": [
        {
          "name": "Legislation",
          "url": "http://namespace.org#legislation",
          "type": "objprop",
          "objPropSource": "http://namespace.org#compliesWithLegislation",
          "properties": [
            {
              "name": "hasLegislationName",
              "url": "http://namespace.org#hasLegislationName",
              "type": "dataprop"
            }
            ]
        }
        ]
    },
    {
      "name": "legislation",
      "url": "http://namespace.org#legislation",
      "type": "objprop",
      "objPropSource": "http://namespace.org#compliesWithLegistion",
      "properties": [
        {
          "name": "hasLegislationName",
          "url": "http://namespace.org#hasLegislationName",
          "type": "dataprop"
        }
        ]
    }
  ]
}`;
}