Langkau ke kandungan utama

Penukar JSON ke TypeScript percuma

Jana antara muka TypeScript atau alias jenis daripada mana-mana objek atau tatasusunan JSON. Tampal JSON anda dan dapatkan jenis TypeScript sedia guna dengan segera.

Berfungsi luar talian selepas dimuatkan
export interface User {
  id: number;
  name: string;
  email: string;
  isActive: boolean;
  score: number;
  tags: string[];
  address?: null;
}

export interface Root {
  user: User;
  createdAt: string;
  version: number;
}

Kegunaan biasa

  • Hasilkan Jenis TypeScript daripada Respons APITampal respons JSON API dan hasilkan segera antarmuka TypeScript untuk kod depan yang selamat jenis.
  • Jenis TypeScript untuk Objek Konfigurasi dan TetapanHasilkan antarmuka TypeScript daripada fail konfigurasi JSON untuk menambah keselamatan jenis kepada tetapan aplikasi anda.
  • Hasilkan Jenis TypeScript daripada Rekod Pangkalan DataTukarkan rekod pangkalan data yang dieksport JSON atau hasil pertanyaan ORM kepada antarmuka TypeScript untuk penaipan lapisan data.
  • Data Mata Air Jenis dan Lekapan UjianHasilkan antarmuka TypeScript daripada data mata air JSON dan lekapan ujian untuk jenis ujian unit dan cerita Storybook anda.
  • Jenis Respons API Pihak KetigaHasilkan antarmuka TypeScript daripada respons API pihak ketiga di mana jenis rasmi hilang atau ketinggalan zaman.

Cara ia berfungsi

Alat ini menggunakan algoritma pengesanan jenis rekursif tulisan tangan dengan sifar pustaka luaran β€” JSON.parse untuk mengesahkan dan menghurai input, kemudian traversal tersuai yang melalui setiap nilai dalam pokok JSON dan mengeluarkan pengisytiharan antara muka atau jenis TypeScript terus dalam pelayar. Tiada apa dihantar ke pelayan.

  1. 1
    JSON dihurai dan disahkan
    Input anda dihantar kepada JSON.parse. Jika ia gagal, ralat penghuraian tepat dipaparkan serta-merta di bawah input. Penghuraian berjaya menghasilkan pokok nilai bertaip yang menggerakkan selebihnya penukaran.
  2. 2
    Pengesanan jenis rekursif
    Fungsi getType rekursif melalui setiap nod: primitif memetakan kepada string, number, boolean, atau null; objek mencetuskan antara muka bernama baharu; tatasusunan objek mempunyai kunci mereka digabungkan merentasi semua elemen supaya kunci hadir hanya dalam sesetengah item menjadi pilihan dan jenis nilai bercanggah digabung dengan |.
  3. 3
    Penamaan antara muka selamat-perlanggaran
    Setiap objek bersarang mendapat nama PascalCase diperoleh daripada kunci JSONnya (snake_case, kebab-case, dan ruang kesemuanya dinormalisasi). Jika dua objek berbeza secara struktur akan berkongsi nama sama, akhiran berangka ditambah (Data, Data2, …) dan bukan senyap-senyap menulis ganti takrifan terdahulu.
  4. 4
    Output dipaparkan dan boleh dimuat turun
    Antara muka bersarang dikeluarkan dahulu, kemudian jenis akar, diformat sebagai export interface atau export type bergantung pada pilihan anda. Hasil boleh disalin ke papan keratan atau dimuat turun sebagai fail .ts β€” kesemuanya dibina dengan Blob standard dan tiada pergi-balik pelayan.

Alat berkaitan

Soalan lazim