✨ الكائنات المتداخلة والمصفوفات داخل الكائنات في JavaScript
🎉 أهلاً أبطال البرمجة!
في الأجزاء السابقة تعلمنا الكائنات وكيفية تعديلها. الآن، سنغوص أكثر ونتعرف على الكائنات المتداخلة وكيفية استخدام المصفوفات داخل الكائنات، وهذا مهم جدًا لتنظيم البيانات الكبيرة والمعقدة بطريقة سهلة وواضحة. 🚀
تخيل أن لديك دفتر كبير، وكل صفحة فيه تحتوي على معلومات مختلفة. بعض هذه الصفحات تحتوي على جداول، وبعضها يحتوي على قوائم. هذا بالضبط ما نفعله عند استخدام الكائنات المتداخلة والمصفوفات داخل الكائنات في JavaScript.
🧩 ما هي الكائنات المتداخلة؟
الكائنات المتداخلة تعني ببساطة أن هناك كائنًا بداخل كائن آخر. هذا يشبه أن يكون لديك حقيبة مدرسية، وداخلها مقلمة صغيرة، وداخل المقلمة يوجد أقلام وألوان. ✏️🎒
💡 مثال بسيط:
let student = {
name: "علي",
age: 10,
address: {
city: "رام الله",
street: "شارع فلسطين",
postalCode: 12345
}
};
console.log(student.address.city); // "رام الله"
console.log(student.address.postalCode); // 12345
لاحظ أن address
هو كائن متداخل داخل الكائن الأساسي student
. هذا يساعدنا في تنظيم البيانات بشكل أفضل بدلًا من وضع كل شيء في مستوى واحد.
🔗 المصفوفات داخل الكائنات
المصفوفات داخل الكائنات تستخدم لتخزين مجموعة من العناصر المرتبطة بالكائن. مثلًا، لعبة تحتوي على أسماء لاعبين، أو مدرسة تحتوي على قائمة صفوف. ✨
💡 مثال:
let game = {
name: "المنقذ السريع",
players: ["أحمد", "سارة", "ليلى"],
scores: [100, 150, 120]
};
console.log(game.players[1]); // "سارة"
console.log(game.scores[2]); // 120
من خلال game.players[1]
وصلنا إلى اللاعب الثاني "سارة". ومن خلال game.scores[2]
وصلنا إلى نتيجة اللاعب الثالث.
🛠️ تعديل الكائنات المتداخلة والمصفوفات
يمكننا تعديل أي خاصية داخل الكائنات المتداخلة أو تحديث عناصر المصفوفة بسهولة جدًا باستخدام النقطة .
أو دوال المصفوفات مثل push
.
💡 مثال عملي:
let student = {
name: "ليلى",
age: 9,
address: { city: "بيت لحم", street: "شارع النصر" },
hobbies: ["رسم", "قراءة"]
};
// تعديل اسم المدينة
student.address.city = "رام الله";
// إضافة هواية جديدة
student.hobbies.push("سباحة");
// حذف هواية
student.hobbies.splice(0, 1); // حذف أول هواية "رسم"
console.log(student);
كما ترى، بإمكاننا تعديل القيم بسهولة، وإضافة أو حذف عناصر جديدة داخل المصفوفة.
🎨 أمثلة ممتعة للأطفال
💡 لعبة مع فريق اللاعبين
let myGame = {
name: "سباق السيارات",
teams: [
{ teamName: "الأحمر", players: ["علي", "سعاد"] },
{ teamName: "الأزرق", players: ["ليلى", "مازن"] }
],
rounds: 3
};
// الوصول للاعب في الفريق الأزرق
console.log(myGame.teams[1].players[0]); // "ليلى"
// إضافة لاعب جديد للفريق الأحمر
myGame.teams[0].players.push("محمد");
// تعديل اسم الفريق الأزرق
myGame.teams[1].teamName = "الأزرق السريع";
console.log(myGame);
💡 مكتبة كتب
let library = {
name: "مكتبتي",
books: [
{ title: "رحلة البرمجة", author: "سعاد", year: 2020 },
{ title: "مغامرات الرياضيات", author: "علي", year: 2019 }
]
};
// إضافة كتاب جديد
library.books.push({ title: "علوم ممتعة", author: "ليلى", year: 2021 });
// تعديل سنة إصدار كتاب
library.books[0].year = 2022;
// الوصول لمؤلف الكتاب الثاني
console.log(library.books[1].author); // "علي"
🎯 تمرين عملي للأطفال
جرب أن تصنع كائن يمثل فريقك المفضل أو صفك الدراسي، واستخدم:
- كائنات متداخلة لتخزين معلومات عن كل عضو.
- مصفوفات لتخزين الهوايات أو الدرجات أو أسماء اللاعبين.
- جرب إضافة، تعديل، أو حذف عناصر لتتقن التحكم بالكائنات.
💡 مثال لإلهامك:
let myClass = {
name: "الصف الرابع",
students: [
{ name: "ليلى", age: 9, hobbies: ["رسم", "قراءة"] },
{ name: "علي", age: 10, hobbies: ["كرة القدم", "سباحة"] }
]
};
// إضافة طالب جديد
myClass.students.push({ name: "سارة", age: 9, hobbies: ["غناء", "قراءة"] });
// تعديل هواية علي
myClass.students[1].hobbies.push("برمجة");
// حذف هواية من ليلى
myClass.students[0].hobbies.splice(0, 1);
console.log(myClass);
🧠 مثال متقدم: مدرسة كاملة
لنوسع الفكرة أكثر: تخيل أن لدينا كائن يمثل مدرسة كاملة بصفوفها وطلابها. هذا يعطينا فكرة كيف تُستخدم الكائنات المتداخلة لتنظيم البيانات الكبيرة.
let school = {
name: "مدرسة المستقبل",
classes: [
{
className: "الصف الرابع",
students: [
{ name: "ليلى", age: 9, hobbies: ["رسم", "قراءة"] },
{ name: "علي", age: 10, hobbies: ["كرة القدم", "سباحة"] }
]
},
{
className: "الصف الخامس",
students: [
{ name: "سارة", age: 10, hobbies: ["غناء", "كتابة"] },
{ name: "مازن", age: 11, hobbies: ["شطرنج", "قراءة"] }
]
}
]
};
// الوصول إلى هواية أول طالب في الصف الخامس
console.log(school.classes[1].students[0].hobbies[1]); // "كتابة"
هذا المثال يوضح كيف يمكن أن يكون لدينا كائن ضخم منظم بطريقة سهلة الاستخدام.
💡 نصائح مهمة
- استخدم الكائنات المتداخلة لتنظيم البيانات الكبيرة مثل المدارس أو الألعاب أو المكتبات.
- المصفوفات داخل الكائنات مثالية لتخزين عناصر متكررة مثل اللاعبين أو الكتب أو الطلاب.
- جرب دائمًا إضافة، تعديل، وحذف الخصائص لفهم كيفية التحكم بالكائنات.
- فكر بالكائنات المتداخلة كصناديق بداخل صناديق، والمصفوفات كقوائم داخل هذه الصناديق.
- التدريب المستمر سيجعلك تستخدم هذه المفاهيم بسهولة واحترافية.
💬 سؤال اليوم:
إذا أردت تخزين معلومات عن فريقك أو مدرستك، كيف ستنظم الكائنات المتداخلة والمصفوفات داخلها؟ جرب إنشاء كائن myTeam
أو mySchool
وأضف إليه التعديلات الخاصة بك! 🌟
📌 خلاصة المقال:
- الكائنات المتداخلة تساعدنا في تنظيم البيانات الكبيرة والمعقدة بشكل مرتب.
- المصفوفات داخل الكائنات تستخدم لتخزين قوائم مترابطة.
- يمكن الوصول للبيانات باستخدام النقطة
.
والفهارس[]
. - يمكن تعديل، إضافة، وحذف أي عنصر بسهولة.
- التدريب العملي يجعلك أكثر إبداعًا في التعامل مع البيانات.
🚀 رائع جدًا! الآن أنت ملم بالكائنات والمصفوفات المتقدمة، ومستعد للجزء القادم الذي سنتعلم فيه التكرار على الكائنات والمصفوفات: الحلقات والطرق العملية بطريقة ممتعة وسهلة. 😉