使用 typescript 中 JSON 類型的接口創建對象

Question

給定 JSON，我很難理解 object 類型是如何形成的。例如，我有這個 JSON object，我需要為其形成一個類型。

// "Spokane, WA": {
  //   "My M": "M-Spokane-WA.json",
  //   "MY D": "D-Spokane-WA.json"
  // },
  // "Pondera, MT": {
  //   "My M": "M-Pondera-MT.json",
  //   "MY D": "D-Pondera-MT.json"
  // },

我遵循的規則是在創建 object 時復制 JSON，然后為變量命名。 最后我有這樣的事情。

export interface IStateType {
cityState: string {   // "Spokane, WA" is in quotes so seems like is coming in string.
My M :string  // "My M" is string .. How to show the  "M-Spokane-WA.json" part???
MY D: string  
}
}

原來這是正確的表達方式

export interface IStateType  {
     [cityState: string]: {
        ["My M"]: string;
        ["MY D"]: string;
      };
}

有人可以解釋一下為什么我們對 cityState 使用 [] 以及為什么在 My M 和 My D 周圍有引號而不是在 cityState 周圍嗎？

-------------- 更新 2 來自索引簽名上的鏈接

interface StringArray {
  [index: number]: string;  // It says string is a return type..
}

let myArray: StringArray;
myArray = ["Bob", "Fred"];  // Is this the return mentioned above :string?

let myStr: string = myArray[0];  // Is myArray[0] this the [index:number] part of interfaces StringArray? 

Answer 1

讓我們反匯編接口定義。

export interface IStateType  {
    [cityState: string]: <some value type definition>,
}

我們在這里定義了一個索引簽名。 索引簽名使接口能夠擁有無限數量的與確切類型匹配的屬性。 鍵必須是string類型，值必須是<some value type definition>

然后不是<some value type definition> ，它實際上是：

{
    ["My M"]: string;
    ["MY D"]: string;
};

這與

{
    "My M": string;
    "MY D": string;
};

您必須在My M和My D兩邊使用引號，因為字符串中有空格。 如果沒有空格，您可以直接使用MyM和MyD ，不帶引號。

---

您不能使用["cityState"]而不是[cityState: string] ，因為這是您定義索引簽名的方式。

您必須使用[cityState: string]而不是cityState: string的原因是因為這可以讓您傳遞任意數量的城市州的 JSON object 並且可以正常工作。 您的原始接口定義只接受一個城市 state。

---

編輯 1：示例

我在您的代碼中看到了一些明顯的錯誤，所以這里是更正后的版本。

interface StringArray {
  [index: number]: string;
}

let myArray: StringArray;
myArray = {0: "Fred"};

let myStr: string = myArray[0]; // "Fred"

myArray中的每個屬性都需要有一個number作為key ， string作為value 。 這是在代碼[index: number]: string中定義的。 rest 是不言自明的 imo。

---

這是另一個例子：

let myArray2: StringArray;
myArray2 = {
  4: "hello",
  7: "world",
  3643728: "enjoy",
  1: "good",
  5.2: "luck",  // 5.2 is a number
};

console.log(myArray2[5.2]); // Logs "luck"