TypeScript में JSON के साथ काम करना: शुरुआती लोगों के लिए पार्सिंग और सीरियलाइज़ेशन

शुरुआती लोगों के लिए ऑनलाइन Python प्रशिक्षक

Python आसानी से सीखें बिना सिद्धांत के बोझ के। स्वचालित जांच के साथ व्यावहारिक कार्य हल करें और ब्राउज़र में सीधे कोड लिखें।

पाठ्यक्रम शुरू करें

परिचय: क्यों JSON और TypeScript एक आदर्श जोड़ी हैं

\n

JSON (JavaScript Object Notation) एक हल्का डेटा विनिमय प्रारूप है जो वेब अनुप्रयोगों के लिए डी-फैक्टो मानक बन गया है। TypeScript, बदले में, JavaScript में स्थैतिक टाइपिंग जोड़ता है, जो डेटा के साथ काम को अधिक सुरक्षित और पूर्वानुमानित बनाता है। शुरुआती डेवलपर्स के लिए, TypeScript में JSON को पार्स करना (स्ट्रिंग को ऑब्जेक्ट में बदलना) और सीरियलाइज़ करना (ऑब्जेक्ट को स्ट्रिंग में बदलना) एक मौलिक कौशल है।

\n

इस लेख में, हम TypeScript में JSON के साथ काम करने के सभी पहलुओं को कवर करेंगे: बुनियादी संचालन से लेकर टाइपिंग के साथ उन्नत तकनीकों तक। आप सीखेंगे कि सामान्य गलतियों से कैसे बचें और स्वच्छ, रखरखाव योग्य कोड कैसे लिखें।

\n\n

TypeScript में JSON पार्सिंग की मूल बातें

\n

JSON पार्सिंग JSON प्रारूप की स्ट्रिंग को TypeScript ऑब्जेक्ट में बदलने की प्रक्रिया है। इसके लिए मुख्य उपकरण वैश्विक फ़ंक्शन JSON.parse() है। हालांकि, TypeScript में टाइपिंग से संबंधित अपनी बारीकियां हैं।

\n\n

JSON स्ट्रिंग का बुनियादी पार्सिंग

\n

एक सरल उदाहरण पर विचार करें: हमारे पास एक JSON स्ट्रिंग है जो एक उपयोगकर्ता का प्रतिनिधित्व करती है।

\n
const jsonString = '{"name": "अन्ना", "age": 28, "isStudent": false}';\nconst user = JSON.parse(jsonString);\nconsole.log(user.name); // "अन्ना"\nconsole.log(user.age);  // 28
\n

समस्या यह है कि TypeScript को नहीं पता कि user ऑब्जेक्ट की संरचना क्या है। डिफ़ॉल्ट रूप से, JSON.parse() any प्रकार लौटाता है, जो स्थैतिक टाइपिंग के लाभों को समाप्त कर देता है।

\n\n

पार्सिंग परिणाम की टाइपिंग

\n

इसे ठीक करने के लिए, हम स्पष्ट रूप से लौटाए गए मान का प्रकार निर्दिष्ट कर सकते हैं। सबसे आसान तरीका टाइप असर्शन (type assertion) का उपयोग करना है।

\n
interface User {\n    name: string;\n    age: number;\n    isStudent: boolean;\n}\n\nconst jsonString = '{"name": "अन्ना", "age": 28, "isStudent": false}';\nconst user = JSON.parse(jsonString) as User;\nconsole.log(user.name); // TypeScript जानता है कि name एक string है
\n

अब TypeScript ऑब्जेक्ट की संरचना को समझता है और उन तक पहुँचने पर गुणों के प्रकारों की जाँच कर सकता है।

\n\n

TypeScript में ऑब्जेक्ट्स का JSON में सीरियलाइज़ेशन

\n

सीरियलाइज़ेशन विपरीत प्रक्रिया है: TypeScript ऑब्जेक्ट को JSON स्ट्रिंग में बदलना। इसके लिए JSON.stringify() फ़ंक्शन का उपयोग किया जाता है।

\n\n

सीरियलाइज़ेशन का बुनियादी उदाहरण

\n
interface Product {\n    id: number;\n    title: string;\n    price: number;\n    inStock: boolean;\n}\n\nconst product: Product = {\n    id: 101,\n    title: "लैपटॉप",\n    price: 54999.99,\n    inStock: true\n};\n\nconst jsonString = JSON.stringify(product);\nconsole.log(jsonString);\n// {"id":101,"title":"लैपटॉप","price":54999.99,"inStock":true}
\n

JSON.stringify() फ़ंक्शन स्वचालित रूप से ऑब्जेक्ट को JSON स्ट्रिंग में बदल देता है। यह याद रखना महत्वपूर्ण है कि सभी मानों को सीरियलाइज़ नहीं किया जा सकता: फ़ंक्शन, undefined, Symbol — उन्हें छोड़ दिया जाएगा या null से बदल दिया जाएगा।

\n\n

replacer के साथ सीरियलाइज़ेशन को अनुकूलित करना

\n

कभी-कभी यह नियंत्रित करने की आवश्यकता होती है कि अंतिम स्ट्रिंग में कौन से फ़ील्ड शामिल हों। इसके लिए, JSON.stringify() दूसरा तर्क लेता है — एक replacer फ़ंक्शन या कुंजियों की एक सरणी।

\n
const product = {\n    id: 101,\n    title: "लैपटॉप",\n    price: 54999.99,\n    discount: 10,\n    secretCode: "SECRET123"\n};\n\n// गुप्त डेटा को बाहर करें\nconst safeJson = JSON.stringify(product, (key, value) => {\n    if (key === 'secretCode') {\n        return undefined; // इस फ़ील्ड को छोड़ें\n    }\n    return value;\n});\nconsole.log(safeJson);\n// {"id":101,"title":"लैपटॉप","price":54999.99,"discount":10}
\n\n

उन्नत तकनीकें: नेस्टेड ऑब्जेक्ट्स और ऐरे के साथ काम करना

\n

वास्तविक अनुप्रयोगों में, JSON शायद ही कभी सपाट होता है। अक्सर नेस्टेड ऑब्जेक्ट्स, ऐरे और जटिल डेटा संरचनाएं पाई जाती हैं। TypeScript इंटरफेस की मदद से इस जटिलता को प्रबंधित करने में मदद करता है।

ब्लॉग

पुस्तक अनुशंसाएँ