Miks teisendada JSON TypeScriptiks?

TypeScript kasutab staatilisi tüüpe, et tuvastada bugi kompileerimise ajal, mitte käitusajal. API-de, konfiguratsioonifailide või mis tahes välise andmeallika kasutamisel, mis tagastab JSON-i, on tavaliselt vaja määratleda tüübid või liidesed, mis kirjeldavad andmete struktuuri. Nende definitsioonide käsitsi kirjutamine on tüütu ja veaohtlik, eriti sügavalt pesastatud objektide või suurte massiivide puhul, millel on erinev struktuur. Teisendamise automatiseerimine säästab aega ja vähendab riski, et teie tüübid ei vasta tegelikele andmetele.

Tööriista kirjeldus

See tööriist võtab mis tahes kehtiva JSON-sisendi — objektid, massiivid või pesastatud struktuurid — ja genereerib koheselt vastavad TypeScripti tüübialiad või liidesed. See tuvastab automaatselt pesastatud objektid, loob igaühe jaoks eraldi nimega tüübid ning käsitleb massiive elemendi tüüpide tuletamise teel. Saate valida interface ja type väljundrežiimi vahel vastavalt oma projekti konventsioonidele.

Näited

Sisend JSON:

{
  "id": 1,
  "name": "Alice",
  "email": "alice@example.com",
  "address": {
    "street": "123 Main St",
    "city": "Springfield",
    "zip": "62701"
  },
  "roles": ["admin", "editor"]
}

Väljund (Interface režiim):

interface RootObject {
  id: number;
  name: string;
  email: string;
  address: Address;
  roles: string[];
}

interface Address {
  street: string;
  city: string;
  zip: string;
}

Väljund (Type režiim):

type RootObject = {
  id: number;
  name: string;
  email: string;
  address: Address;
  roles: string[];
};

type Address = {
  street: string;
  city: string;
  zip: string;
};

Funktsioonid

  • Valige interface või type aliase väljundi vahel ühe rippmenüüga
  • Pesastatud objektitüüpide automaatne tuvastamine ja eraldamine
  • Massiivi elemendi tüübi tuletus, sealhulgas objektide massiivid
  • Ühendab massiivides erinevad objektikujud üheks ühtlustatud tüübiks valikuliste omadustega
  • Reaalajas teisendamine süntaksiesiletõstmisega JSON- ja TypeScript-redaktoritega

Kasutusjuhud

  • TypeScripti tüüpide kiire määratlemine API vastuse koormuste jaoks frontend-arenduse käigus
  • Tüübidefinitsioonide genereerimine JSON-konfiguratsioonifailidest või andmebaasi ekspordifailidest
  • Tüübiturvalisete andmemudelite algseadistamine uue TypeScripti projekti alustamisel

Kuidas see töötab

Tööriist parsib kehtivat JSON-i ja läbib rekursiivselt kogu struktuuri. Iga leitud objekti jaoks loob see nimega liidese või tüübialias väljadega, mis vastavad objekti võtmetele. Pesastatud objektid loovad lisatüüpe, millele viidatakse nimepidi. Massiive analüüsitakse elemendi tüübi määramiseks — kui kõik elemendid on objektid, ühendatakse nende kujud üheks tüübiks, kus võtmed, mida ei esine igas elemendis, muutuvad valikuliseks.

Näpunäited

  • Kleepige esinduslik näidis oma JSON-andmetest. Mida täielikum on näidis, seda täpsemad on genereeritud tüübid.
  • Segatud objektikujudega massiivide puhul lisage mitu objekti, et tööriist saaks tuvastada valikulised väljad.
  • Kasutage Type režiimi, kui teie projekt eelistab objektikujude jaoks tüübialaseid, või Interface režiimi, kui järgite liidese konventsiooni.