18- دروس جافا سكربت – JS Object Display

### شرح مفصل لـ “عرض الكائنات في JavaScript”

تُعتبر الكائنات في JavaScript واحدة من أهم الميزات التي توفر مرونة وقوة في البرمجة. [شركة برمجة مصرية] يُستخدم الكائن لتخزين مجموعات من البيانات وكيانات أكثر تعقيدًا. في هذا المقال، سنستعرض كيفية عرض الكائنات في JavaScript بطرق متعددة مع توضيح ذلك بأمثلة.

#### مفهوم الكائن في JavaScript

الكائن في JavaScript هو مجموعة من القيم المرتبطة. يحتوي كل كائن على خصائص، وكل خاصية تتكون من زوج مفتاح/قيمة. يمكن أن تكون القيم عبارة عن دوال، مما يجعل الكائنات قادرة على تمثيل الكيانات ذات السلوك.

#### إنشاء كائن

يمكن إنشاء كائن باستخدام الطريقة الأبسط وهي استخدام الأقواس المعقوفة `{}`. [شركة برمجة مصرية] إليك مثال على إنشاء كائن بسيط:

let person = {
    firstName: "John",
    lastName: "Doe",
    age: 30,
    isEmployed: true
};

#### عرض الكائن

هناك عدة طرق لعرض محتويات كائن في JavaScript، وسنستعرض بعضها هنا:

##### 1. استخدام `console.log()`

تُعد `console.log()` الطريقة الأكثر شيوعًا لعرض كائنات JavaScript عند فحصها أو تصحيح الأخطاء.

console.log(person);

##### 2. استخدام الحلقات

يمكنك استخدام حلقة `for…in` للمرور عبر جميع خصائص الكائن وعرضها:

for (let key in person) {
    console.log(key + ": " + person[key]);
}

##### 3. استخدام `Object.keys()` و `forEach`

تُمكّنك `Object.keys()` من الحصول على مصفوفة تحتوي على جميع مفاتيح الكائن، ومن ثم يمكن استخدام `forEach` للمرور عليها:

Object.keys(person).forEach(key => {
    console.log(key + ": " + person[key]);
});

##### 4. استخدام `JSON.stringify()`

لعرض الكائن كنص JSON، يمكنك استخدام `JSON.stringify()`، وهي مفيدة بشكل خاص عند إرسال الكائن إلى خادم أو تخزينه:

let personJSON = JSON.stringify(person);
console.log(personJSON);

##### 5. استخدام `Object.entries()`

تُرجع `Object.entries()` مصفوفة من الأزواج [المفتاح، القيمة] التي يمكن المرور عليها باستخدام `forEach` أو حلقة `for…of`:

Object.entries(person).forEach(([key, value]) => {
    console.log(key + ": " + value);
});

#### مثال متقدم: كائن متداخل

يمكن أن تحتوي الكائنات في JavaScript على كائنات أخرى كقيم لخصائصها، مما يُعرف بالكائنات المتداخلة. إليك مثال على كيفية عرض كائن متداخل:

let employee = {
    name: "Alice",
    position: "Developer",
    details: {
        age: 28,
        skills: ["JavaScript", "React", "Node.js"]
    }
};

for (let key in employee) {
    if (typeof employee[key] === 'object' && !Array.isArray(employee[key])) {
        for (let subKey in employee[key]) {
            console.log(subKey + ": " + employee[key][subKey]);
        }
    } else {
        console.log(key + ": " + employee[key]);
    }
}

### الخاتمة

تُعتبر الكائنات في JavaScript أدوات قوية ومرنة تتيح لك التعامل مع البيانات بطرق متعددة ومبتكرة. من خلال فهم الطرق المختلفة لعرض الكائنات، يمكنك تحسين قدرتك على التعامل مع البيانات في تطبيقاتك البرمجية بشكل فعال.