✨ تعديل الكائنات في JavaScript: إضافة، تغيير، وحذف الخصائص
🎉 أهلاً أبطال البرمجة!
في المقال السابق، تعلمنا ما هو الكائن في JavaScript وكيفية تخزين المعلومات داخل خصائصه. الآن حان وقت المرح! 😎 سنتعلم كيف نعدل الكائنات: نضيف خصائص جديدة، نغير القيم، أو نحذف خصائص غير مرغوبة. هيا نبدأ!
🛠️ إضافة خصائص جديدة للكائن
يمكننا بسهولة إضافة خصائص جديدة لأي كائن باستخدام النقطة .
أو الأقواس []
.
💡 مثال:
let student = { name: "علي", age: 10 };
// إضافة خاصية جديدة باستخدام النقطة
student.grade = 5;
// إضافة خاصية جديدة باستخدام الأقواس
student.hobbies = ["كرة القدم", "الرسم"];
console.log(student);
/*
{
name: "علي",
age: 10,
grade: 5,
hobbies: ["كرة القدم", "الرسم"]
}
*/
انظروا كيف أصبح الكائن student
يحتوي الآن على خصائص جديدة بدون حذف أي شيء قديم.
✏️ تعديل قيم الخصائص
تغيير قيمة أي خاصية في الكائن سهل جدًا. فقط نكتب اسم الخاصية ونعطيها قيمة جديدة.
💡 مثال:
let book = { title: "رحلة البرمجة", pages: 120 };
// تغيير عدد الصفحات
book.pages = 150;
// تغيير العنوان
book.title = "مغامرات البرمجة";
console.log(book);
/*
{
title: "مغامرات البرمجة",
pages: 150
}
*/
الآن الكائن book
يعكس التحديثات الجديدة بسهولة!
🗑️ حذف خصائص من الكائن
إذا لم نعد بحاجة لخاصية معينة، يمكننا حذفها باستخدام كلمة delete
.
💡 مثال:
let pet = { name: "لولو", type: "قطة", age: 3 };
// حذف خاصية العمر
delete pet.age;
console.log(pet);
/*
{
name: "لولو",
type: "قطة"
}
*/
لاحظوا أن الخاصية age
اختفت تمامًا من الكائن.
🎨 أمثلة ممتعة للأطفال
💡 لعبة فيديو
let myGame = {
name: "المنقذ السريع",
type: "مغامرة",
players: 2
};
// إضافة خصائص جديدة
myGame.features = ["مستويات صعبة", "رسوم متحركة جميلة"];
myGame.online = true;
// تعديل اسم اللعبة
myGame.name = "المنقذ الخارق";
// حذف عدد اللاعبين
delete myGame.players;
console.log(myGame);
/*
{
name: "المنقذ الخارق",
type: "مغامرة",
features: ["مستويات صعبة", "رسوم متحركة جميلة"],
online: true
}
*/
💡 حيوان أليف
let pet = { name: "لولو", type: "قطة", colors: ["أبيض", "أسود"] };
// إضافة عمر جديد
pet.age = 3;
// تعديل اسم الحيوان
pet.name = "لولو الجميلة";
// حذف اللون الأسود
pet.colors.pop();
console.log(pet);
/*
{
name: "لولو الجميلة",
type: "قطة",
colors: ["أبيض"],
age: 3
}
*/
🧩 استخدام المتغيرات لتعديل الخصائص
يمكن استخدام متغيرات لتحديد أي خاصية نريد تعديلها. هذا مفيد إذا كان الاختيار يعتمد على المستخدم.
💡 مثال:
let student = { name: "ليلى", age: 9, grade: 4 };
let userChoice = "grade";
student[userChoice] = 5;
console.log(student);
/*
{
name: "ليلى",
age: 9,
grade: 5
}
*/
🎯 تمرين عملي للأطفال
جرب أن تنشئ كائن يمثل لعبتك أو حيوانك المفضل، ثم:
- أضف خصائص جديدة
- غيّر قيمة بعض الخصائص
- احذف خاصية لم تعد بحاجة إليها
💡 مثال لإلهامك:
let myPet = { name: "بوبي", type: "كلب" };
// إضافة العمر واللون
myPet.age = 2;
myPet.color = "بني";
// تعديل الاسم
myPet.name = "بوبي الجميل"
// حذف اللون
delete myPet.color;
console.log(myPet);
/*
{
name: "بوبي الجميل",
type: "كلب",
age: 2
}
*/
💡 نصائح مهمة
- أضف فقط الخصائص التي تحتاجها لتبقي الكائن مرتبًا.
- استخدم أسماء واضحة عند تعديل أو إضافة خصائص.
- التجربة العملية هي أفضل طريقة لتعلم تعديل الكائنات.
- جرب دمج عدة طرق: النقطة، الأقواس، والمتغيرات لتصبح محترفًا.
💬 سؤال اليوم:
إذا أردت تعديل كائن يمثل مدرستك أو فريقك المفضل، ما الخصائص التي ستضيفها أو تغيرها؟
جرب كتابة كائن mySchool
أو myTeam
وتطبيق الإضافات، التعديلات، والحذف! 🌟

📌 خلاصة المقال:
- يمكن تعديل أي كائن بإضافة، تغيير، أو حذف الخصائص.
- استخدم
.
أو[]
أو المتغيرات لتحديد الخصائص. - حافظ على الكائن مرتبًا وواضحًا أثناء التعديل.
- التجربة العملية مع الأمثلة تساعدك على فهم الكائنات أكثر.
🚀 رائع! الآن أصبح لديك خبرة كاملة في **تعديل الكائنات**، ومستعد للمقال القادم عن الكائنات المتداخلة والمصفوفات داخل الكائنات بطريقة ممتعة وسهلة. 😉