जावास्क्रिप्ट में JSON ऑब्जेक्ट कैसे बनाएं? उदाहरण सहित समझाएं।

परिचय

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

उदाहरण

निम्न कोड जावास्क्रिप्ट में JSON ऑब्जेक्ट बनाने के लिए है:

<!DOCTYPE html> <html lang="hi"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>JSON ऑब्जेक्ट</title> <style> body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; font-weight: 500; } </style> </head> <body> <h1>जावास्क्रिप्ट में JSON ऑब्जेक्ट</h1> <div class="sample"></div> <div style="color: green;" class="result">JSON ऑब्जेक्ट <br></div> <button class="Btn">यहाँ क्लिक करें</button> <h3> JSON ऑब्जेक्ट बनाने और प्रदर्शित करने के लिए ऊपर दिए गए बटन पर क्लिक करें </h3> <script> const resEle = document.querySelector(".result"); const obj = { firstName: 'रोहन', lastName: 'शर्मा', Age: 14 }; document.querySelector(".Btn").addEventListener("click", () => { for (const key in obj) { resEle.innerHTML += 'key = ' + key + ' value = ' + obj[key] + '<br>'; } // JSON स्ट्रिंग में परिवर्तित करने के लिए: // const jsonStr = JSON.stringify(obj); }); </script> </body> </html>

आउटपुट

उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा:

'यहाँ क्लिक करें' बटन पर क्लिक करने पर:

JSON.stringify() के साथ सीरियलाइज़ेशन

const obj = { name: 'रोहन', age: 22, skills: ['JS', 'Python'] };
const jsonStr = JSON.stringify(obj);
// '{"name":"रोहन","age":22,"skills":["JS","Python"]}'

// सुंदर प्रिंटिंग (इंडेंटेशन के साथ)
const pretty = JSON.stringify(obj, null, 2);
// {
//   "name": "रोहन",
//   "age": 22,
//   "skills": ["JS", "Python"]
// }

// कस्टम सीरियलाइज़ेशन के लिए toJSON() मेथड
const user = {
  name: 'रोहन',
  password: 'secret',
  toJSON() {
    return { name: this.name }; // पासवर्ड बाहर रखें
  }
};
JSON.stringify(user); // '{"name":"रोहन"}'