TypeScript में JSON प्रोसेसिंग: उदाहरणों के साथ पूर्ण गाइड

TypeScript में JSON प्रोसेसिंग: बुनियादी संचालन से लेकर उन्नत टाइपिफिकेशन तक

JSON (JavaScript Object Notation) वेब डेवलपमेंट में डेटा आदान-प्रदान का प्रमुख प्रारूप बना हुआ है। TypeScript, JavaScript का एक सख्ती से टाइप किया गया सुपरसेट होने के नाते, JSON के साथ सुरक्षित और कुशलतापूर्वक काम करने के लिए शक्तिशाली उपकरण प्रदान करता है। इस लेख में, हम TypeScript में JSON प्रोसेसिंग के सभी पहलुओं को कवर करेंगे: सरल पार्सिंग से लेकर जेनेरिक और तृतीय-पक्ष लाइब्रेरीज़ के साथ जटिल वैलिडेशन तक।

1. बुनियादी संचालन: पार्सिंग और सीरियलाइज़ेशन

TypeScript JSON के साथ काम करने के लिए JavaScript के अंतर्निहित तरीकों को पूरी तरह से इनहेरिट करता है: JSON.parse() और JSON.stringify()। हालाँकि, TypeScript में उनके उपयोग के लिए टाइपों पर विशेष ध्यान देने की आवश्यकता है।

JSON स्ट्रिंग को पार्स करना

// सरल पार्सिंग — परिणाम anyconst rawData = JSON.parse('{"name": "Alice", "age": 30}');// rawData का प्रकार any है — TypeScript के सभी लाभ खो जाते हैं

// सही तरीका: जेनेरिक के माध्यम से अपेक्षित प्रकार निर्दिष्ट करेंinterface User {  name: string;  age: number;}

const user: User = JSON.parse('{"name": "Alice", "age": 30}');// user अब टाइप किया गया है, लेकिन TypeScript रनटाइम पर अनुरूपता की जाँच नहीं करता है

महत्वपूर्ण: JSON.parse() यह जाँच नहीं करता है कि पास की गई स्ट्रिंग निर्दिष्ट इंटरफ़ेस से मेल खाती है या नहीं। इससे रनटाइम के दौरान त्रुटियाँ हो सकती हैं। विश्वसनीय वैलिडेशन के लिए अतिरिक्त उपकरणों का उपयोग करें।

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

const user: User = { name: "Bob", age: 25 };const jsonString = JSON.stringify(user);// परिणाम: '{"name":"Bob","age":25}'

// replacer के साथ कस्टम सीरियलाइज़ेशनconst filteredJson = JSON.stringify(user, ['name']);// परिणाम: '{"name":"Bob"}'

// इंडेंटेशन के साथ फ़ॉर्मेटिंगconst prettyJson = JSON.stringify(user, null, 2);/* परिणाम:{  "name": "Bob",  "age": 25}*/

2. JSON डेटा का टाइपिफिकेशन: इंटरफ़ेस और टाइप

सही टाइपिफिकेशन JSON के साथ काम करते समय TypeScript का मुख्य लाभ है। आइए मुख्य दृष्टिकोणों पर विचार करें।

डेटा संरचनाओं के लिए इंटरफ़ेस

interface ApiResponse<T> {  status: 'success' | 'error';  data: T;  message?: string;  timestamp: number;}

interface Product {  id: string;  title: string;  price: number;  tags: string[];  inStock: boolean;}

// API प्रतिक्रिया को टाइप करने के लिए जेनेरिक का उपयोगtype ProductResponse = ApiResponse<Product>;

const response: ProductResponse = {  status: 'success',  data: {    id: 'prod-123',    title: 'Wireless Mouse',    price: 29.99,    tags: ['electronics', 'accessories'],    inStock: true  },  timestamp: Date.now()};

डायनामिक JSON संरचनाओं के लिए टाइप

// अज्ञात कुंजियों वाली ऑब्जेक्ट के लिएtype DynamicObject = Record<string, unknown>;

// सख्ती से टाइप किए गए शब्दकोशों के लिएinterface Config {  [key: string]: string | number | boolean;}

// पॉलीमॉर्फिक JSON के लिए Union टाइपtype Shape =   | { kind: 'circle'; radius: number }  | { kind: 'rectangle'; width: number; height: number }  | { kind: 'triangle'; base: number; height: number };

function calculateArea(shape: Shape): number {  switch (shape.kind) {    case 'circle': return Math.PI * shape.radius ** 2;    case 'rectangle': return shape.width * shape.height;    case 'triangle': return (shape.base * shape.height) / 2;  }}

3. JSON डेटा का वैलिडेशन: रनटाइम जाँच

TypeScript केवल कंपाइलेशन चरण पर टाइपों की जाँच करता है। JSON डेटा (जैसे, बाहरी API से) के रनटाइम वैलिडेशन के लिए विशेष लाइब्रेरीज़ का उपयोग करें।

डिक्लेरेटिव वैलिडेशन के लिए Zod का उपयोग

import { z } from 'zod';

// स्कीमा परिभाषित करेंconst UserSchema = z.object({  name: z.string().min(2).max(50),  age: z.number().int().positive().max(120),  email: z