«الخاصية اختفت، والكائن بقي»: كيف تحذف ما لا تحتاجه في JavaScript؟
\n\nتخيل موقفًا: أنت تعمل مع كائن كبير جاء من الخادم. يحتوي على 20 حقلًا، لكن لإرسال النموذج تحتاج فقط إلى 15. أو أنك تكتب دالة يجب أن تعيد بيانات بدون الحقل المساعد _id. ماذا تفعل؟ السؤال الأكثر شيوعًا على Stack Overflow حول هذا الموضوع حصد مئات الآلاف من المشاهدات - وهذا ليس من قبيل الصدفة.
حذف خاصية من كائن هي إحدى تلك المهام التي تبدو تافهة، لكنها تخفي بعض المفاجآت. في هذه المقالة، سنستعرض جميع الطرق الأساسية لحذف خاصية من كائن في JavaScript، ونقارن أداءها وقابليتها للتغيير، ونكتشف أي نهج نختار في عام 2025.
\n\nالطريقة رقم 1: عامل الحذف delete - الكلاسيكية
\n\nالطريقة الأكثر وضوحًا والأولى تاريخيًا هي استخدام عامل delete. فهو يحذف الخاصية من الكائن بشكل نهائي ولا رجعة فيه.
const user = {\n name: 'آنا',\n email: 'anna@example.com',\n password: 'super_secret_123'\n};\n\ndelete user.password;\n\nconsole.log(user);\n// { name: 'آنا', email: 'anna@example.com' }\nconsole.log(user.password); // undefined\n\n\nكيف يعمل delete في الواقع؟
\n\nعامل delete لا يقوم فقط بتعيين undefined. بل يزيل الخاصية تمامًا من الكائن. يمكنك التحقق من ذلك باستخدام طريقة hasOwnProperty:
const car = { brand: 'Tesla' };\nconsole.log(car.hasOwnProperty('brand')); // true\n\ndelete car.brand;\nconsole.log(car.hasOwnProperty('brand')); // false\n\n\nالفرق المهم: بعد delete، تتوقف الخاصية عن الوجود. عند التكرار عبر for...in أو Object.keys()، لن تظهر.
متى لا يعمل delete؟
\n\nهناك بعض «المزالق»:
\n\n- \n
- لا يمكن حذف الخصائص المعلنة عبر var/let/const. عامل
deleteيعمل فقط مع خصائص الكائنات. \n - لا يتم حذف الخصائص الموروثة من النموذج الأولي - فقط الخصائص الخاصة. \n
- الخصائص ذات العلامة configurable: false (مثل تلك الموجودة في الكائنات المضمنة) لا يتم حذفها. في الوضع الصارم، سيؤدي ذلك إلى خطأ. \n
// مثال: خاصية مع configurable: false\nconst obj = {};\nObject.defineProperty(obj, 'fixed', {\n value: 42,\n configurable: false\n});\n\ndelete obj.fixed; // false (لم يتم الحذف)\nconsole.log(obj.fixed); // 42\n\n\nالطريقة رقم 2: التفكيك وعامل rest - النهج الحديث
\n\nإذا كنت تعمل مع بيانات غير قابلة للتغيير (وهو أمر يعتبر جيدًا في JavaScript الحديثة)، فقد لا يكون delete الخيار الأفضل - فهو يغير الكائن الأصلي. البديل هو إنشاء كائن جديد بدون الخاصية غير المرغوب فيها باستخدام التفكيك:
const user = {\n name: 'إيفان',\n email: 'ivan@example.com',\n role: 'admin',\n token: 'abc123'\n};\n\n// حذف حقل token، مع إنشاء كائن جديد\nconst { token, ...userWithoutToken } = user;\n\nconsole.log(userWithoutToken);\n// { name: 'إيفان', email: 'ivan@example.com', role: 'admin' }\nconsole.log(user.token); // 'abc123' — الكائن الأصلي لم يتأثر!\n\n\nهذا النهج شائع بشكل خاص في تطوير React، عندما تحتاج إلى تمرير جزء فقط من الخصائص إلى المكون، مع استبعاد الحقول المساعدة.
\n\nإيجابيات وسلبيات التفكيك
\n\n- \n
- + عدم القابلية للتغيير: يبقى الكائن الأصلي دون تغيير. هذا مهم لـ Redux و Vuex والبرمجة الوظيفية. \n
- + قابلية القراءة: يظهر بوضوح الحقول التي نستبعدها. \n
- - الأداء: يتم إنشاء نسخة من الكائن، وهو ما قد يكون مكلفًا للكائنات الكبيرة. \n
- - غير مريح لحذف العديد من الخصائص: إذا كنت بحاجة إلى إزالة 5 حقول من أصل 20،