UrsaKit LogoUrsaKit

JSON 轉 TypeScript

從任意 JSON 範例產生可直接使用的 TypeScript 介面，巢狀物件與陣列會自動標型別，全程在瀏覽器內完成。

TypeScript 輸出

JSON 轉 TypeScript 是什麼？

JSON 轉 TypeScript 會讀取你的資料範例，寫出對應的介面：物件的鍵變成屬性、陣列變成元素陣列、巢狀物件各自成為獨立介面，形成一份可再手工微調的起始結構。

型別由範例推斷，因此只出現過數字的欄位會是 number。同一個鍵若在不同位置有不同形狀，產生器會放寬成聯合型別，讓程式仍可編譯。

如何從 JSON 產生 TypeScript

  1. 把 JSON 物件或陣列貼到輸入框。
  2. 可選擇重新命名根介面，預設為 RootObject。
  3. 按「產生 TypeScript」。
  4. 複製介面，或下載成 .ts 檔。

JSON 轉 TypeScript 範例

含巢狀陣列的物件

{"id": 1, "name": "Ada", "tags": ["math", "logic"]}
interface RootObject {
  id: number;
  name: string;
  tags: string[];
}

物件陣列

[{"id": 1, "active": true}, {"id": 2, "active": false}]
interface RootObject {
  id: number;
  active: boolean;
}

JSON 轉 TypeScript：UrsaKit 與其他做法

比較項目UrsaKit自己實作一般網上工具
準備工作打開網頁自己寫產生器或用 tsc廣告與上傳
範例推斷自動手動依網站而定
可離線執行是，在瀏覽器內是通常不行
輸出複製或下載 .ts依你的程式通常只能複製
常見問題

常見問題

我的 JSON 會被上傳嗎？

不會。介面在瀏覽器內以 JavaScript 產生，範例不會離開你的裝置。

可以自訂根介面名稱嗎？

可以，在「根介面名稱」輸入名稱，預設是 RootObject。

會偵測選填欄位嗎？

產生器會替範例中看到的每個欄位標型別；若某些記錄缺少該欄位，不會自動加上 ?，請自行依資料情況補上。

型別混用時會怎樣？

同一個鍵同時出現字串與數字時，會放寬成聯合型別，確保輸出仍可編譯。

支援物件陣列嗎？

支援。陣列中的每個物件會合併成單一介面來描述元素。

巢狀物件會各自產生介面嗎？

會。巢狀物件會成為獨立的具名介面，並由父層介面引用。

全部工具