JSON-dan TypeScript xulosa qilish qanday ishlaydi
Xulosa chiqarish tahlil qilingan JSON daraxti ustida bitta oʻtish. Vosita har bir qiymatni oʻqiydi, unga TypeScript turini belgilaydi, keyin topgan har bir ob’ekt uchun bitta interfeys yozadi.
- JSON namunasini brauzerning mahalliy tahlilchisi bilan tahlil qiling va notoʻgʻri kiritishni qator/ustun ishtishi bilan rad eting.
- Har bir qiymat uchun TypeScript turini aniqlash —
string,number,boolean,null, massiv yoki ichki ob’ekt. - Har bir ichki ob’ektga ota xususiyat kalitidan olingan interfeys nomi berish (shuning uchun
user.addressAddressinterfeysiga aylanadi). - Har bir massiv boʻyicha element turlarini birlashtirish, shuning uchun
{id: 1}va{id: 2, label: "x"}roʻyxati toʻgʻri ixtiyoriy maydonlar bilan union hosil qiladi. - Opsiyalarni qoʻllash (interface yoki type, readonly, ixtiyoriy-nullable) va deklaratsiyalarni bogʻliqlik tartibida chiqarish, shuning uchun fayl oldinga havolalarsiz kompilyatsiya qilinadi.
Nima uchun JSON-dan TypeScript turlarini yaratish kerak?
- Koʻpgina shakl xatolari javob turi yozib qoʻyilgan boʻlsa kompilyatsiya paytida topilishi mumkin. Haqiqiy yuklamadan interfeys xulosa qilish uning koʻp qismini siz uchun yozadi va `strict` rejim hujjatlar eslatishni unutgan maydonni topadi.
- Xulosa qilingan interfeyslarni Zod yoki io-ts kabi ish vaqti validatori bilan juftlashtirish bir xil shakl uchun ikkita ish beradi: ishlanmada muharrir avtomatik toʻldirish va ishlab chiqarish kutilmagan narsa yuborganda chekkada 400.
- TypeScript language server faqat bilgan maydonlarni koʻrsatadi. Xulosa qilingan interfeysni import qilganingizdan soʻng, nuqtani yozgan zahoti avtomatik toʻldirish ishlaydi — javobda `as any` cast va repoda asabiy grep yoʻq.
- Agar OpenAPI spetsifikatsiyasi yozmoqchi boʻlsangiz, xulosa qilingan interfeys javob sxemasining tezkor birinchi qoralama. Siz hali ham qoʻlda yozilgan misollar va cheklovlarni xohlaysiz, lekin xususiyat nomlari va turlari allaqachon toʻgʻri.
Keng tarqalgan qoʻllanishlar
Xulosa chiqarish haqiqiy yuklag mavjud, lekin sxema boʻlmagan paytda koʻproq yordam beradi.
- Handler yozishdan oldin Stripe, GitHub yoki Twilio-dan uchinchi tomon webhook yuklamalarini tiplash.
- Backend tushgan kuni frontend jamoasi unga qarshi kodlashni boshlashi uchun ichki REST API uchun turlarni ishga tushirish.
- Kuzatilgan API javobidan Zod, io-ts yoki Valibot sxemasi uchun boshlangʻich nuqta yaratish.
Natija qanday koʻrinadi?
Namuna JSON hujjati va ildiz nomi berilganda, generator ichki ob’ekt uchun bitta interfeys, ob’ekt uchun bitta interfeys daraxti ishlab chiqaradi. User ildiz nomi bilan quyidagi kiritish uchun:
{"id":1,"name":"Alice","tags":["a","b"],"address":{"city":"Paris"}}-ni User ildiz nomi bilan joylashtiring va generator quyidagini ishlab chiqaradi:
export interface User {
id: number;
name: string;
tags: string[];
address: Address;
}
export interface Address {
city: string;
}
E’tibor bering address oʻzining nomlangan interfeysiga koʻtarildi — bu bogʻliqlik-tartibli chiqarish. Bir xil JSON type deklaratsiya uslubi bilan export type User = {...}-ni chiqaradi; readonly tugmasi yoqilganda har bir xususiyat readonly modifikatorini oladi.
Generator opsiyalari
Deklaratsiya uslubi
Ob’ekt shakllari uchun standart TypeScript idioma boʻlmish interface (keyinchalik mapped turlar, shartli turlar yoki kesishmalar kerak boʻlsa qulay boʻlgan type)-ni tanlang. Ikkalasi ham bir xil ish vaqti xatti-harakatini ishlab chiqaradi; tanlov kodlash-uslub ustunligidir.
Ixtiyoriy nullable maydonlar
Namuna qiymat null boʻlganida maydonnig turi T | null ga aylanadi. Bu opsiyani yoqish TypeScript tomonida maydonni ixtiyoriy qiladigan ? modifikatorni ham qoʻshadi — API kalit umuman qaytarmasdan null qaytarayotganida foydali.
Readonly modifikatori
Chiqarilgan interfeys oʻzgarmas maʻlumotlar modeli bilan mos kelishi uchun har bir xususiyat deklaratsiyasiga readonly ni qoʻshadi. Redux holat qismlamlari, muzlatilgan API javoblari yoki kompilyator tasodifiy mutatsiyani belgilab qoʻyishini xohlagan har qanday joyda qulay.
Bu ichki ob’ektlar va massivlarni qoʻllab-quvvatlaydimi?
Ha. Har bir ichki ob’ekt ota xususiyat kalitidan olingan nomlangan interfeysga aylanadi va massivlar tarkibidan element turini xulosa qiladi. Ob’ektlar massivlari ob’ekt shakli uchun bitta interfeys oladi, shakl mos kelmaganda union turlari bilan.
Ixtiyoriy maydonlar qanday xulosa qilinadi?
"Null boʻlishi mumkin maydonlarni ixtiyoriy" tugmasini yoqing va namuna qiymati null boʻlgan har qanday maydon kalit ustida ? modifikatori va turda | null oladi. Tugmasiz, maydon zarur boʻlib qoladi va tur faqat T | null.
Bu diskrimant union-larni qoʻllab-quvvatlaydimi?
Massiv aralash-shakl elementlarni ushlaganida yoki maydon ham qiymat ham null olib yurganida asosiy union turlar chiqadi. Toʻliq diskrimant-union xulosa qilish (tag sifatida type yoki kind tanlash va variantlarni ajratish) bir nechta namuna talab qiladi — bu rejada bor, lekin bugungi qurishda emas.
Bir nechta JSON namunasidan turlarni xulosa qilish mumkinmi?
Hali yoʻq — bugungi xulosa chiqaruvchi bir vaqtda bitta namunani oʻqiydi. Agar bitta interfeysni boʻlishishi kerak boʻlgan ikkita yuklamangiz boʻlsa (masalan, roʻyxat endpoint va bitta-element endpoint), amaliy yechim ularni bitta massivga birlashtirish, undan yaratish va keyin olingan union turlarini qayta nomlash. Koʻp-namunali xulosa chiqarish yoʻl xaritasida — bu bir javobda mavjud va boshqasida yoʻq maydonlarni topishning yagona usuli.
Yuklamani joylashtiring, ildizni nomlang, interfeyslarni nusxalang. Butun quvur brauzeringizda ishlaydi, shuning uchun chiqarilmagan API yoki imzolangan webhook tanasi mashinangizda qoladi.