Objects In JavaScript

🎯 ما هو الكائن (Object) في JavaScript؟

الكائن (Object) هو نوع بيانات يُستخدم لتخزين مجموعة من البيانات والمعلومات المرتبطة معًا، باستخدام أزواج من مفتاح وقيمة (Key/Value).

يشبه الكائن حقيبة تحتوي على معلومات.

✅ الصيغة الأساسية:

const person = {
  name: "Ali",
  age: 25,
  isStudent: true
};

🔍 التوضيح:

• name, age, isStudent: هي المفاتيح (keys).
• "Ali", 25, true: هي القيم (values).

📦 الكائن يمكن أن يحتوي على:

• نصوص
• أرقام
• Boolean
• مصفوفات
• كائنات أخرى
• دوال (Functions)

🧠 متى تستخدم الكائنات؟

• عندما تحتاج إلى تمثيل شيء يحتوي على مواصفات متعددة (مثل مستخدم، سيارة، منتج…).
• عندما تحتاج إلى تجميع بيانات مرتبطة.
• عند استخدام APIs (مثل جلب بيانات JSON).

📌 الوصول إلى القيم:

1. باستخدام النقطة:

console.log(person.name); // "Ali"

باستخدام الأقواس:

console.log(person["age"]); // 25

🛠️ تعديل القيم:

person.age = 30;
person["name"] = "Omar";

➕ إضافة خصائص جديدة:

person.country = "Egypt";

❌ حذف خاصية:

delete person.isStudent;

🧪 مثال مع دالة داخل كائن:

const car = {
  brand: "Toyota",
  model: "Camry",
  year: 2022,
  start: function() {
    console.log("The car started.");
  }
};

car.start(); // The car started.

🔁 التكرار على خصائص كائن:

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

📥 إنشاء كائن باستخدام Object:

const user = new Object();
user.name = "Sarah";
user.role = "Admin";

📦 مثال عملي:

const product = {
  id: 101,
  name: "Laptop",
  price: 1500,
  specs: {
    ram: "16GB",
    cpu: "Intel i7"
  }
};

console.log(product.specs.cpu); // Intel i7

لنفهم الفرق بين Dot Notation و Bracket Notation في JavaScript عند التعامل مع الكائنات.

📌 أولًا: ما هما؟

• Dot Notation (.): الطريقة الأكثر استخدامًا للوصول إلى قيمة خاصية (property) من كائن.
• Bracket Notation (["key"]): طريقة بديلة تُستخدم عندما لا يمكنك استخدام النقطة.

✅ 1. Dot Notation

💡 الصيغة:

object.key

🧪 مثال:

const user = {
  name: "Ali",
  age: 30
};

console.log(user.name); // "Ali"
console.log(user.age);  // 30

✅ متى تستخدمها؟

• عندما يكون اسم الخاصية مكونًا صالحًا كـ identifier (بدون مسافات، ولا يبدأ برقم، ولا يحتوي رموز غريبة).
• عندما تعرف اسم الخاصية مسبقًا.

✅ 2. Bracket Notation

💡 الصيغة:

object["key"]

const user = {
  name: "Ali",
  age: 30,
  "home address": "Cairo"
};

console.log(user["name"]);         // "Ali"
console.log(user["home address"]); // "Cairo"

✅ متى تستخدمها؟

• عندما يحتوي اسم الخاصية على مسافات أو رموز خاصة.
• عندما تريد الوصول إلى الخاصية باستخدام متغيّر.
• عندما يكون الاسم ناتج من المستخدم أو من API.

🔁 مثال مهم: استخدام متغيّر

const key = "age";
console.log(user[key]); // ✅ 30
console.log(user.key);  // ❌ undefined (لأن هذا يعني user["key"])

🚫 متى لا تعمل Dot Notation؟

const user = {
  "first name": "Ali"
};

console.log(user.first name); // ❌ Syntax Error
console.log(user["first name"]); // ✅ "Ali"

🧠 خلاصة المقارنة:

🧪 مثال تطبيقي:

const setting = {
  theme: "dark",
  "user-role": "admin"
};

const key = "theme";

console.log(setting.theme);          // "dark" ✅ Dot
console.log(setting["user-role"]);   // "admin" ✅ Bracket
console.log(setting[key]);           // "dark" ✅ باستخدام متغير