JS Object Display عرض الكائن

JavaScript - عرض الكائن (Object Display)

🔸 لعرض محتويات كائن في JavaScript، يمكنك استخدام عدة طرق لعرض خصائصه أو طباعته على الشاشة أو في وحدة التحكم (Console). وفي بعض الحالات، تحتاج لتحويله إلى نص باستخدام JSON.stringify().

---

🔹 العرض باستخدام console.log()

const person = {
  name: "Mahmoud",
  age: 41
};

console.log(person);

📌 هذا يعرض الكائن كاملًا في وحدة التحكم.

---

🔹 العرض داخل HTML

document.getElementById("demo").innerHTML = person.name + " - " + person.age;

📌 يتم عرض الخصائص يدويًا من خلال ربطها بسلسلة نصية.

---

🔹 استخدام JSON.stringify()

document.getElementById("demo").innerHTML = JSON.stringify(person);

📌 تُحوّل الكائن إلى سلسلة نصية (string) بصيغة JSON لعرضه داخل الصفحة أو حفظه.

---

🔹 استخدام for...in لعرض الخصائص

let output = "";
for (let key in person) {
  output += key + ": " + person[key] + "
";
}

document.getElementById("demo").innerHTML = output;

---

🔹 المخرجات داخل alert

alert(JSON.stringify(person));

---

⚠️ ملاحظات مهمة

• console.log() هو الأسلوب الأفضل في مرحلة التطوير والتصحيح.
• JSON.stringify() مفيد لتحويل الكائنات إلى نصوص.
• لا يمكن عرض دوال الكائن أو الخصائص التي تحتوي على undefined باستخدام JSON.stringify().