شرح صفوف ومحتوى الفقرة
احذر من أشهر فخ يقع فيه المطورون مع [...arr] و{ ...obj }: فالنشر ينفذ نسخاً سطحياً للمستوى الأول فقط (Shallow Copy)! فإذا كان الكائن يضم بداخله كائناً فرعياً أو مصفوفة داخلية (مثل user.roles)، فإن النسخة السطحية تظل مرتبطة بنفس مرجع المصفوفة الداخلية في الذاكرة، وتعديلها يفسد الكائن الأصلي بصمت!
متى احتوى الكائن على مستويات متداخلة أو تواريخ، اعتمد الدالة القياسية المدمجة structuredClone(original) لإنشاء نسخة عميقة مستقلة بالكامل (Deep Copy) تفصل جميع المستويات الفرعية بأمان.
const base = { name: 'Team', tags: ['js'] };
const shallow = { ...base };
const deep = structuredClone(base);
shallow.tags.push('mutated-shallow');
deep.tags.push('isolated-deep');
document.getElementById('cln-out').textContent =
'base.tags: ' + base.tags.join(', ') + '\n' +
'deep.tags: ' + deep.tags.join(', ');ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
ميّزت في هذا الدرس بين معامل النشر Spread ومعامل التجميع Rest، ونسخت المصفوفات والكائنات مع فهم قاعدة غلبة المفتاح الأخير، وجمعت وسائط الدوال المرنة في مصفوفة حقيقية، وعزلت البنى المتداخلة بالنسخ العميق عبر structuredClone(). الخطوة التالية: انتقل الآن إلى درس «إدارة ملفات تعريف الارتباط Cookies في JavaScript» لقراءة وضبط صلاحية وحماية ملفات الارتباط بسمات Secure وSameSite وHttpOnly!