打字稿索引签名返回索引签名中缺少的数组结果

Question

我有一个类似

的JSON

"phone":{
"home":[{"label":"Phone1", "val":"123"},{"label":"Phone1", "val":"123"},{"label":"Phone1", "val":"123"}],
"work":[{"label":"Phone1", "val":"123"}, {"label":"Phone1", "val":"123"}, {"label":"Phone1", "val":"123"}],
"....":[{"label":"Phone1", "val":"123"}]}

所以可能有更多的手机对象f.e.紧急电话等等，但我知道的是值将是一个标签/ val对象数组。

所以我创建了一个接口

export interface Person {
    phone:IHashOfPhones
}

export interface IHashOfPhones {
    [index:string]: Phone[]
}

export interface Phone {
    label: string;
    val:string; 
}

然而在编译过程中我有错误，如

Index signature is missing in type { home : ...

如果我设置IHashOfPhones以返回any一切正常，但我放松了类型安全。

在代码中我将循环它，没有任务

有没有办法如何保持类型安全或我正在做一些完全错误的事情？

Answer 1

具有可索引类型

来自JSON字符串：

let jsonString: string = `{
  phone: {
    home: [{ label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }],
    work: [{ label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }],
    other: [{ label: "Phone1", val: "123" }]
  }
}`;
let data1: Person = JSON.parse(jsonString);

或者，来自JS对象：

let data2: Person = <any>{
  phone: {
    home: [{ label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }],
    work: [{ label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }],
    other: [{ label: "Phone1", val: "123" }]
  }
};

syntax of indexable types是一种定义使用语法obj['propertyName']动态命名的属性类型的方法。它不是定义任何静态属性的方法，即使JavaScript允许它也是如此。另请参阅this answer。

具有静态属性

另一种方法是静态定义可用属性：

export interface IHashOfPhones { // Replace the other implementation by this one
  home?: Phone[]
  work?: Phone[]
  other?: Phone[]
}
let data3: Person = {
  phone: {
    home: [{ label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }],
    work: [{ label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }, { label: "Phone1", val: "123" }],
    other: [{ label: "Phone1", val: "123" }]
  }
};