json 对象的 Typescript 定义文件，具有字符串属性作为类型指示符

Question

我正在研究为 Plotly.js 创建一个 Typescript 定义文件。我查看了 DefinitelyTyped 存储库中的许多示例定义文件。想到的一个问题是数据对象的接口。 Data 对象是一个 Traces 数组，如 plot-schema 中所示。

考虑这个数据对象的例子。

data = [
    {
         type: 'scatter',  
         x: [1, 2, 3],     
         y: [3, 1, 6],     
         marker: {         
             color: 'rgb(16, 32, 77)' 
         }
    },
    {
         type: 'bar',      
         x: [1, 2, 3],     
         y: [3, 1, 6],     
         name: 'bar chart example' 
    }
];

跟踪类型，例如 'scatter' 和 'bar'，可以具有不同的属性。例如，'pie' 跟踪类型具有 "direction" 属性。

虽然我想为每种跟踪类型定义单独的接口，并将公共属性分解到更高级别的接口中，但我看不到这样做的好方法。

我能想到的最直观的方法是这样的...

interface Trace {
    x: Array<any>;
    y: Array<any>;
}

interface BarTrace extends Trace {
   type: 'bar';
   // bar specific members
}

interface ScatterTrace extends Trace {
    type: 'scatter';
    // scatter specific members
}

这不是有效的打字稿。需要一个类型，而不是字符串 'bar' 或 'scatter'。

是否有人知道具有类似结构的其他库具有 typescript 定义，或者是否有更好的方法来构建此 JSON 结构的 typescript 定义文件？

Answer 1

我认为您最好的选择是按原样继续，但将 type 定义为字符串。类似于以下内容：

interface Trace {
    type: string;
    x: Array; 
    y: Array; 
}

interface BarTrace extends Trace {
   // bar specific members
}

interface ScatterTrace extends Trace {
    // scatter specific members
}

let data: Array<Trace> = [
    {
         type: 'scatter',  
         x: [1, 2, 3],     
         y: [3, 1, 6],     
         marker: {         
             color: 'rgb(16, 32, 77)' 
         }
    },
    {
         type: 'bar',      
         x: [1, 2, 3],     
         y: [3, 1, 6],     
         name: 'bar chart example' 
    }
];

一旦确定 type 是 "scatter" 还是 "bar"，就可以按如下方式转换变量。

data.forEach((item) => {
    if (item.type === 'scatter') {
        let trace: ScatterTrace = item;
        // ...
    } else {
        let trace: BarTrace = item;
        // ...
    }
});

json 对象的 Typescript 定义文件，具有字符串属性作为类型指示符

Typescript definition file for json objects with string attributes as type indicators

typescript

jsonschema

plotly

definitelytyped