DevToolPal
हि

JSON से TypeScript

JSON नमूने से TypeScript इंटरफ़ेस या टाइप बनाएँ, नेस्टेड टाइप, वैकल्पिक फ़ील्ड और null के साथ।

लोकल रूप से चलता है, कभी अपलोड नहीं होता

विकल्प

इस रूप में घोषित करें
null मान

JSON

0 कैरेक्टर · 0 B

TypeScript

0 कैरेक्टर · 0 B

यह क्या करता है

JSON से TypeScript जनरेटर किसी JSON नमूने, जैसे API रिस्पॉन्स या कॉन्फ़िग फ़ाइल, को पढ़कर उसे बताने वाले TypeScript इंटरफ़ेस लिखता है। हर फ़ील्ड हाथ से टाइप करने के बजाय एक असली रिस्पॉन्स पेस्ट करें और ऐसे टाइप पाएँ जो fetch नतीजों, Redux स्टेट या टेस्ट डेटा के लिए सीधे कोड में काम आएँ।

जनरेटर सिर्फ़ पहले मान को नहीं, हर मान को देखता है। संख्याएँ number, टेक्स्ट string बनता है, नेस्टेड ऑब्जेक्ट को अपना इंटरफ़ेस मिलता है और ऐरे के आइटम मिला दिए जाते हैं, इसलिए जो फ़ील्ड केवल कुछ आइटम में है वह वैकल्पिक चिह्नित होता है और जो कभी-कभी null होता है उसे nullable टाइप मिलता है।

इस्तेमाल कैसे करें

  1. JSON को इनपुट में पेस्ट करें, .json फ़ाइल अपलोड करें या उदाहरण पर क्लिक करें।
  2. रूट टाइप का नाम तय करें और स्टाइल चुनें: interface या type, null को | null या वैकल्पिक फ़ील्ड के रूप में, readonly प्रॉपर्टी, और हर घोषणा पर export लगाना है या नहीं।
  3. TypeScript कॉपी करें या .ts फ़ाइल के रूप में डाउनलोड करें।

गलत JSON होने पर समस्या की लाइन और कॉलम बताया जाता है, ताकि आप नमूना तुरंत ठीक कर सकें।

उदाहरण

यह JSON:

{ "id": 7, "name": "Ada", "tags": ["admin"], "manager": { "id": 1, "email": null } }

इन घोषणाओं में बदल जाता है:

export interface Root {
  id: number;
  name: string;
  tags: string[];
  manager: Manager;
}

export interface Manager {
  id: number;
  email: null;
}

सुझाव

  • एक नमूना वही दिखाता है जो उसमें है। अगर कोई फ़ील्ड स्ट्रिंग या null हो सकता है, तो दोनों के उदाहरण शामिल करें या कई नमूनों को एक ऐरे में रखें ताकि वे मिल जाएँ।
  • जो फ़ील्ड नाम मान्य आइडेंटिफ़ायर नहीं हैं, जैसे first-name, उन्हें उद्धरण चिह्नों में लिखा जाता है, इसलिए आउटपुट हमेशा कंपाइल होता है।
  • नतीजा एक शुरुआती बिंदु है। जब आप नमूने से ज़्यादा जानते हों, तो स्ट्रिंग फ़ील्ड को लिटरल यूनियन या Date तक सीमित करें।
  • Go चाहिए? JSON से Go कन्वर्टर उसी अनुमान से json टैग वाले struct लिखता है।

अक्सर पूछे जाने वाले सवाल

› नेस्टेड ऑब्जेक्ट कैसे संभाले जाते हैं?

हर नेस्टेड ऑब्जेक्ट अपना अलग नामित इंटरफ़ेस बनता है, जिसका नाम उसकी कुंजी के PascalCase रूप से आता है, इसलिए address फ़ील्ड से Address इंटरफ़ेस बनता है। बिल्कुल एक जैसी संरचना वाले ऑब्जेक्ट एक ही इंटरफ़ेस साझा करते हैं, और टकराने वाले नामों में Address2 जैसी संख्या जुड़ती है।

› ऐरे का टाइप कैसे तय होता है?

ऐरे के सभी आइटम एक आइटम टाइप में मिला दिए जाते हैं। ऑब्जेक्ट की ऐरे कुंजी के एकवचन नाम वाले इंटरफ़ेस की ऐरे बनती है, इसलिए orders से Order[] मिलता है। मिली-जुली ऐरे (string | number)[] जैसा यूनियन बनती है और खाली ऐरे unknown[] बनती है।

› किसी फ़ील्ड को वैकल्पिक कब चिह्नित किया जाता है?

जब वह ऐरे के कुछ ऑब्जेक्ट में मौजूद न हो। जो फ़ील्ड हर जगह है पर कभी-कभी null होता है, उसे डिफ़ॉल्ट रूप से T | null लिखा जाता है। null मानों को वैकल्पिक पर स्विच करें ताकि null हट जाए और फ़ील्ड प्रश्नचिह्न के साथ वैकल्पिक चिह्नित हो।

› interface चुनूँ या type?

दोनों एक जैसे ऑब्जेक्ट आकार बताते हैं। इंटरफ़ेस को बढ़ाया और मर्ज किया जा सकता है, और कई स्टाइल गाइड ऑब्जेक्ट टाइप के लिए इन्हें पसंद करती हैं। अगर नतीजे को यूनियन या मैप्ड टाइप के साथ जोड़ना है तो type एलियास सुविधाजनक हैं। जो आपके कोडबेस में चलता है वही चुनें।

› क्या मेरा JSON सर्वर पर भेजा जाता है?

नहीं। टाइप आपके ब्राउज़र में ही निकाले जाते हैं, इसलिए असली API रिस्पॉन्स पेस्ट करना सुरक्षित है।