§

JSON नमुना

Type inferrer तयार करत आहे…
§

TypeScript interfaces

TypeScript

Pune आणि Hyderabad मधील TypeScript teams ला हा प्रश्न नेहमीच येतो. Infosys, Wipro किंवा TCS च्या internal microservices मधून येणाऱ्या webhook payloads साठी typed clients नसतात, त्यामुळे सामान्य workflow म्हणजे: network panel मधून real response capture करा, इथे paste करा, endpoint नुसार root चे नाव द्या, आणि output project च्या types directory मध्ये copy करा. TypeScript strict mode नंतर documentation मध्ये न सांगितलेले mismatches catch करतो. हे inferrer पूर्णपणे browser मध्ये run होते, त्यामुळे staging APIs, signed webhook bodies, आणि pre-release endpoints चे payloads कधीही hosted service पर्यंत पोहोचत नाहीत.

JSON-to-TypeScript inference कसे कार्य करते

Inference हा parsed JSON tree वर एकच pass आहे. Tool प्रत्येक value वाचतो, त्यासाठी TypeScript type निवडतो, आणि नंतर सापडलेल्या प्रत्येक object साठी एक interface लिहितो.

  1. Browser च्या native parser ने JSON sample parse करा आणि malformed input line/column hint सह reject करा.
  2. प्रत्येक value साठी TypeScript type ओळखा — string, number, boolean, null, array, किंवा nested object.
  3. प्रत्येक nested object ला त्याच्या parent property key वरून derived interface नाव द्या (म्हणजे user.address एक Address interface बनतो).
  4. प्रत्येक array मध्ये item types merge करा, त्यामुळे {id: 1} आणि {id: 2, label: "x"} च्या list मधून योग्य optional fields सोबत union तयार होतो.
  5. तुमचे options (interface vs. type, readonly, optional-nullable) apply करा आणि dependency order मध्ये declarations emit करा जेणेकरून file forward references शिवाय compile होईल.

JSON मधून TypeScript types का generate करायचे?

  • बहुतेक shape bugs compile time वर catch होऊ शकतात जर response type लिहून ठेवली असेल. Real payload मधून interface infer करणे बहुतेक काम करते, आणि `strict` mode docs मध्ये न सांगितलेले field catch करतो.
  • Inferred interfaces Zod किंवा io-ts सारख्या runtime validator सोबत pair केल्यास एकाच shape ला दोन jobs मिळतात: development मध्ये editor autocomplete आणि production मध्ये unexpected काहीतरी आल्यावर edge वर 400.
  • TypeScript चा language server फक्त त्याला माहीत असलेले fields surface करतो. Inferred interface import केल्यावर, dot type करताच autocomplete काम करते — response वर `as any` cast आणि repo मध्ये frustrated grep नको.
  • OpenAPI spec लिहायची असेल, तर inferred interface response schema चा जलद first draft आहे. Hand-written examples आणि constraints अजून लागतील, पण property names आणि types आधीच बरोबर असतात.

सामान्य उपयोग

Real payload असतो पण schema नसतो तेव्हा inference सर्वाधिक उपयुक्त असते.

  • Handler लिहिण्यापूर्वी Stripe, GitHub, किंवा Twilio च्या third-party webhook payloads typing करणे.
  • Internal REST API साठी types bootstrap करणे जेणेकरून frontend team backend land होण्याच्या दिवशीच coding सुरू करू शकेल.
  • Observed API response मधून Zod, io-ts, किंवा Valibot schema साठी starting point generate करणे.

Output कसे दिसते?

Sample JSON document आणि root name दिल्यावर, generator interfaces चे tree तयार करतो, प्रत्येक nested object साठी एक. खालील input सोबत root name User:

{"id":1,"name":"Alice","tags":["a","b"],"address":{"city":"Paris"}} root name User सोबत paste करा आणि generator तयार करतो:

export interface User {
  id: number;
  name: string;
  tags: string[];
  address: Address;
}

export interface Address {
  city: string;
}
लक्षात घ्या की address स्वतःच्या named interface मध्ये promoted झाला — हा dependency-ordered output आहे. type declaration style सोबत तोच JSON export type User = {...} emit करेल; readonly toggle चालू असल्यास प्रत्येक property ला readonly modifier मिळतो.

निर्माता पर्याय

घोषणा शैली

interface निवडा (object shapes साठी standard TypeScript idiom) किंवा type (नंतर mapped types, conditional types, किंवा intersections लागणार असतील तर उपयुक्त). दोन्ही identical runtime behaviour produce करतात; निवड ही coding-style preference आहे.

पर्यायी null-सक्षम फील्ड

Sampled value null असल्यास, field चा type T | null होतो. हा option चालू केल्यास ? modifier पण जोडतो — API कधीकधी null return करण्याऐवजी key पूर्णपणे वगळतो तेव्हा उपयुक्त.

Readonly संशोधक

प्रत्येक property declaration ला readonly prepend करतो जेणेकरून emitted interface immutable data model शी जुळेल. Redux state slices, frozen API responses, किंवा compiler ने accidental mutation flag करायची असेल तिथे उपयुक्त.

हे nested objects आणि arrays support करते का?

होय. प्रत्येक nested object त्याच्या parent property key वरून derived named interface बनतो, आणि arrays त्यांच्या contents मधून item type infer करतात. Objects च्या arrays ला प्रत्येक object shape साठी interface मिळतो, shapes disagree असल्यास union types सोबत.

Optional fields कसे infer होतात?

"Mark null-able fields optional" toggle चालू करा आणि ज्या field चे sampled value null आहे त्याला key वर ? modifier आणि type मध्ये | null मिळतो. Toggle शिवाय, field required राहतो आणि type फक्त T | null असतो.

हे discriminated unions support करते का?

Basic union types येतात जेव्हा array मध्ये mixed-shape items असतात किंवा field मध्ये value आणि null दोन्ही असतात. Full discriminated-union inference (tag म्हणून type किंवा kind निवडणे आणि variants split करणे) साठी multiple samples लागतात — हे planned आहे पण आजच्या build मध्ये नाही.

मी multiple JSON samples मधून types infer करू शकतो का?

अद्याप नाही — आजचा inferrer एका वेळी एक sample वाचतो. दोन payloads एकच interface share करायला हवे असतील (उदा., list endpoint आणि single-item endpoint), तर practical workaround म्हणजे ते एका array मध्ये merge करा, त्यातून generate करा, आणि resulting union types rename करा. Multi-sample inference roadmap वर आहे कारण एका response मध्ये असलेले आणि दुसऱ्यात नसलेले fields spot करण्याचा तोच एकमेव मार्ग आहे.

Payload paste करा, root चे नाव द्या, interfaces copy करा. संपूर्ण pipeline तुमच्या browser मध्ये run होते, त्यामुळे pre-release API किंवा signed webhook body तुमच्या machine वरच राहते.