जावास्क्रिप्ट में `JSON` क्लास

यह लेख जावास्क्रिप्ट में JSON क्लास को समझाता है।

हम जावास्क्रिप्ट में JSON क्लास को व्यावहारिक उदाहरणों के साथ समझाएंगे।

YouTube Video

जावास्क्रिप्ट में JSON क्लास

JSON ऑब्जेक्ट के पास मुख्यतः दो विधियाँ होती हैं। JSON.stringify() किसी ऑब्जेक्ट को JSON स्ट्रिंग में बदलता है, और JSON.parse() JSON स्ट्रिंग से ऑब्जेक्ट बनाता है। JSON एक डेटा एक्सचेंज प्रारूप है जो केवल कुछ जावास्क्रिप्ट मानों को ही व्यक्त कर सकता है। फ़ंक्शंस, undefined, Symbol, और सर्कुलर रेफरेंस को सीधे JSON में बदला नहीं जा सकता।

JSON.stringify()

सबसे पहले, यहाँ ऑब्जेक्ट को JSON स्ट्रिंग में बदलने का एक बुनियादी उदाहरण है।

1// Convert a JavaScript object to a JSON string.
2const obj = { name: "Alice", age: 30, active: true };
3const jsonString = JSON.stringify(obj);
4console.log(jsonString); // {"name":"Alice","age":30,"active":true}

• यह कोड एक सामान्य ऑब्जेक्ट को JSON स्ट्रिंग में बदलने का सबसे मूल उदाहरण है। JSON.stringify स्ट्रिंग को समकालिक रूप से लौटाता है।

JSON.stringify का दूसरा तर्क (replacer)

JSON.stringify का दूसरा तर्क replacer निर्दिष्ट करके आप रूपांतरण नियमों को विस्तार से नियंत्रित कर सकते हैं। यहाँ केवल विशिष्ट प्रॉपर्टी को रखने के लिए ऐरे का उपयोग करने का एक उदाहरण है।

1// Use a replacer array to include only specific properties during stringification.
2const user = { id: 1, name: "Bob", password: "secret", role: "admin" };
3const safeJson = JSON.stringify(user, ["id", "name", "role"]);
4console.log(safeJson); // {"id":1,"name":"Bob","role":"admin"}

• इस उदाहरण में, सुरक्षित लॉग आउटपुट के लिए password को हटा दिया गया है। यह तब उपयोगी होता है जब आप सुरक्षा कारणों से संवेदनशील जानकारी हटाना चाहते हैं।

replacer को फ़ंक्शन के रूप में उपयोग करना (मान रूपांतरण और फ़िल्टरिंग के लिए)

यदि आप अधिक लचीलापन चाहते हैं, तो प्रत्येक कुंजी और मान को संसाधित करने के लिए फ़ंक्शन प्रदान कर सकते हैं। नीचे Date को ISO स्ट्रिंग के रूप में रखने का एक उदाहरण है।

 1// Use a replacer function to customize serialization.
 2const data = { name: "Carol", joined: new Date("2020-01-01T12:00:00Z") };
 3const jsonCustom = JSON.stringify(data, (key, value) => {
 4  // Convert Date objects to ISO strings explicitly
 5  if (this && this[key] instanceof Date) {
 6    return this[key].toISOString();
 7  }
 8  return value;
 9});
10console.log(jsonCustom); // {"name":"Carol","joined":"2020-01-01T12:00:00.000Z"}

• फ़ंक्शन प्रकार replacer में, कुंजी और मान पास किए जाते हैं, और लौटाया गया मान अंतिम JSON में उपयोग होता है। this पैरेंट ऑब्जेक्ट को संदर्भित करता है, इसलिए इसे नेस्टेड रूपांतरण के लिए भी उपयोग किया जा सकता है।

JSON.parse() की बुनियादी बातें

JSON.parse JSON स्ट्रिंग को वापस ऑब्जेक्ट में बदलता है। इसे try/catch में लपेटें ताकि आप अमान्य JSON को सँभाल सकें।

1// Parse a JSON string into an object and handle parsing errors.
2const jsonText = '{"title":"Example","count":42}';
3try {
4  const parsed = JSON.parse(jsonText);
5  console.log(parsed.title); // Example
6} catch (err) {
7  console.error("Invalid JSON:", err.message);
8}

• यदि स्ट्रिंग अमान्य है, तो अपवाद फेंका जाएगा, इसलिए बाहरी स्रोतों के साथ कार्य करते समय हमेशा अपवाद हैंडलिंग शामिल करें।

reviver का उपयोग करके कस्टम पुनर्स्थापन (Date को पुनर्स्थापित करने का उदाहरण)

JSON.parse के दूसरे तर्क reviver का उपयोग करके आप मानों का पुनर्स्थापन कर सकते हैं। यहाँ संचित स्ट्रिंग तिथि को वापस Date ऑब्जेक्ट में बदलने का एक उदाहरण है।

 1// Use a reviver to turn ISO date strings back into Date objects.
 2const jsonWithDate = '{"name":"Dana","joined":"2021-06-15T09:00:00.000Z"}';
 3const obj = JSON.parse(jsonWithDate, (key, value) => {
 4  // A simple check for ISO date-like strings
 5  if (typeof value === "string" && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z$/.test(value)) {
 6    return new Date(value);
 7  }
 8  return value;
 9});
10console.log(obj.joined instanceof Date); // true

• reviver प्रत्येक कुंजी के लिए कॉल किया जाता है, और लौटाया गया मान अंतिम ऑब्जेक्ट में उपयोग होता है। कृपया अपने एप्लिकेशन के अनुसार कड़ी तिथि प्रारूप जांच करें।

प्रिटी-प्रिंटिंग और space तर्क

पठनीयता के लिए इंडेंटेशन के साथ आउटपुट देने के लिए, JSON.stringify को तीसरा तर्क रूप में संख्या या स्ट्रिंग पास करें।

1// Pretty-print an object with 2-space indentation for readability.
2const config = { host: "localhost", port: 3000, debug: true };
3const pretty = JSON.stringify(config, null, 2);
4console.log(pretty);
5/* {
6  "host": "localhost",
7  "port": 3000,
8  "debug": true
9} */

• ऐसे JSON के लिए जिसे लोग पढ़ेंगे, जैसे लॉग या विन्यास फ़ाइल आउटपुट, इंडेंटेशन निर्दिष्ट करना उपयोगी है। हालाँकि, ध्यान दें कि इससे आकार बढ़ता है।

सर्कुलर रेफरेंस को कैसे संभालें

यदि सर्कुलर रेफरेंस है तो JSON.stringify एक TypeError फेंकता है। सामान्य समाधान यह है कि सर्कुलर रेफरेंस से बचने के लिए seen सेट का उपयोग करके replacer बनाएं।

 1// Safely stringify objects that may contain circular references.
 2function safeStringify(value) {
 3  const seen = new WeakSet();
 4  return JSON.stringify(value, (key, val) => {
 5    if (val && typeof val === "object") {
 6      if (seen.has(val)) return "[Circular]";
 7      seen.add(val);
 8    }
 9    return val;
10  });
11}
12
13const a = { name: "A" };
14a.self = a;
15console.log(safeStringify(a)); // {"name":"A","self":"[Circular]"}

• WeakSet का उपयोग करके आप मेमोरी लीक से बचते हुए सर्कुलर रेफरेंस का पता लगा सकते हैं। सर्कुलर रेफरेंस के मामले में, यह "[Circular]" लौटाता है। "[Circular]" के स्थान पर रेफरेंस आईडी असाइन करना भी संभव है।

toJSON मेथड के साथ कस्टम सीरियलाइजेशन

यदि आप ऑब्जेक्ट पर toJSON मेथड परिभाषित करते हैं, तो JSON.stringify उसका रिटर्न मान उपयोग करता है। यह तब उपयोगी है जब आप प्रत्येक प्रकार के लिए रूपांतरण नियम स्थापित करना चाहते हैं।

 1// Define toJSON on a class to customize its JSON representation.
 2class Point {
 3  constructor(x, y) {
 4    this.x = x;
 5    this.y = y;
 6  }
 7  toJSON() {
 8    // This will be used by JSON.stringify
 9    return { x: this.x, y: this.y, type: "Point" };
10  }
11}
12
13const p = new Point(10, 20);
14console.log(JSON.stringify(p)); // {"x":10,"y":20,"type":"Point"}

• toJSON आपको ऑब्जेक्ट स्तर पर सीरियलाइजेशन नियम परिभाषित करने की सुविधा देता है, जिससे यह replacer की तुलना में अधिक स्थानीयकृत और सहज बनता है।

JSON की सीमाएँ और चेतावनियाँ

कुछ महत्वपूर्ण उदाहरण जो JSON में नहीं बदले जा सकते हैं: undefined, फ़ंक्शंस, Symbol, BigInt और सर्कुलर रेफरेंस। संख्यात्मक सटीकता के बारे में भी सावधान रहें (जैसे बड़े पूर्णांक और IEEE फ्लोटिंग-पॉइंट राउंडिंग)।

 1// Demonstrate values that can't be represented in JSON.
 2const sample = {
 3  a: undefined,
 4  b: function () {},
 5  c: Symbol("s"),
 6  d: 9007199254740993n // BigInt (note: JSON.stringify will throw on BigInt)
 7};
 8// JSON.stringify will throw for BigInt and will drop undefined, functions, symbols in objects.
 9try {
10  console.log(JSON.stringify(sample));
11} catch (err) {
12  console.error("Error during stringify:", err.message);
13}

• BigInt के मामले में, इसे स्ट्रिंग में बदलें या कस्टम replacer या toJSON का उपयोग कर इसकी प्रस्तुति परिभाषित करें।

सुरक्षा (अविश्वसनीय JSON को संभालते समय)

JSON.parse स्वयं सुरक्षित है और eval की तुलना में अधिक सुरक्षित माना जाता है, लेकिन पार्स किए गए ऑब्जेक्ट पर भरोसा करके उसे सीधे प्रॉपर्टी एक्सेस या डाटाबेस क्वेरी के लिए उपयोग करना खतरनाक है। हमेशा सत्यापन करें और जांचें कि डेटा अपेक्षित स्कीमा के अनुसार है या नहीं।

1// Parse external JSON and validate expected properties before use.
2const external = '{"username":"eve","role":"user"}';
3const parsed = JSON.parse(external);
4if (typeof parsed.username === "string" && ["user","admin"].includes(parsed.role)) {
5  console.log("Safe to use parsed.username and parsed.role.");
6} else {
7  throw new Error("Invalid payload");
8}

• इनपुट सत्यापन (स्कीमा सत्यापन) के लिए ajv जैसी लाइब्रेरी का उपयोग मजबूत विकल्प है।

प्रदर्शन पर विचार

बड़े ऑब्जेक्ट्स को बार-बार सीरियलाइज़ और डीसिरियलाइज़ करना CPU और मेमोरी पर बोझ डालता है। यदि आवश्यक हो, तो आप केवल अंतर भेजने, बाइनरी प्रारूप (जैसे MessagePack) का उपयोग करने, या स्ट्रीमिंग (डेटा क्रमिक रूप से प्रोसेस करने) पर विचार कर सकते हैं। ब्राउज़र परिवेश में, आप structuredClone (कॉपी के लिए) या postMessage में ट्रांसफरेबल ऑब्जेक्ट्स का उपयोग कर सकते हैं।

विशिष्ट सुझाव (संक्षिप्त)

आप निम्नलिखित बिंदुओं पर भी विचार कर सकते हैं:।

• लॉग्स के लिए, प्रिटी-प्रिंट से बचें और आकार कम करने के लिए सिंगल-लाइन JSON का उपयोग करें।
• वे ऑब्जेक्ट्स जिन्हें अक्सर सीरियलाइज़ किया जाता है, पहले से हल्का बनाएँ, उदाहरण के लिए, अनावश्यक प्रॉपर्टीज को हटाकर।
• ट्रैवर्सल को कम करने और अनावश्यक प्रॉपर्टीज को हटाने के लिए replacer का उपयोग करें।

व्यावहारिक उदाहरण: API अनुरोध भेजने/प्राप्त करने की प्रक्रिया

अंत में, यहाँ एक क्रम है जो दिखाता है कि सर्वर पर भेजने के लिए ऑब्जेक्ट को सुरक्षित रूप से JSON में कैसे बदलें और प्राप्त उत्तर से तिथि को कैसे पुनर्स्थापित करें।

 1// Prepare payload, stringify safely, send via fetch, and revive dates on response.
 2async function sendUserUpdate(url, user) {
 3  // Remove sensitive info before sending
 4  const payload = JSON.stringify(user, (k, v) => (k === "password" ? undefined : v));
 5  const res = await fetch(url, {
 6    method: "POST",
 7    headers: { "Content-Type": "application/json" },
 8    body: payload
 9  });
10
11  const text = await res.text();
12  // Reviver: convert ISO date strings back to Date
13  const data = JSON.parse(text, (key, value) => {
14    if (typeof value === "string" && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z$/.test(value)) {
15      return new Date(value);
16    }
17    return value;
18  });
19  return data;
20}

• इस उदाहरण में, भेजने से पहले password को हटाया गया है, और प्राप्त करने के बाद तिथि को reviver द्वारा पुनर्स्थापित किया गया है। वास्तविक संचालन में, आपको त्रुटि हैंडलिंग और टाइमआउट प्रोसेसिंग जोड़नी होगी।

सारांश

JSON.stringify() और JSON.parse() का उपयोग करके, आप ऑब्जेक्ट्स और स्ट्रिंग्स के बीच रूपांतरण कर सकते हैं। आप replacer और reviver का उपयोग करके रूपांतरण प्रक्रिया को कस्टमाइज कर सकते हैं, और यदि आप किसी क्लास में toJSON लागू करते हैं, तो प्रत्येक ऑब्जेक्ट को व्यक्तिगत रूप से नियंत्रित कर सकते हैं। सर्कुलर रेफरेंस, BigInt, फ़ंक्शंस आदि को वैसे ही नहीं सँभाला जा सकता, इसलिए आपको उन्हें पहले से प्रोसेस करना होगा।

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

आप हमारे YouTube चैनल पर Visual Studio Code का उपयोग करके ऊपर दिए गए लेख के साथ आगे बढ़ सकते हैं। कृपया YouTube चैनल को भी देखें।

YouTube Video