تطبيق عملي: إزالة التكرارات من المصفوفات باستخدام دالة removeDuplicates


📚 مراجعة سريعة: هذا التطبيق العملي مبني على مفهوم برمجي أساسي. راجع الدرس النظري من هنا أولاً.



تطبيق عملي: إزالة التكرارات من المصفوفات باستخدام دالة removeDuplicates

بعد أن تعرفنا نظريًا على كيفية استخدام كائن Set ومعامل الانتشار لإزالة التكرارات من المصفوفات في JavaScript، حان الوقت لتطبيق هذه المعرفة عمليًا. في هذا الدرس، سنستخدم الدالة removeDuplicates التي قمنا بشرحها، ونرى كيف تعمل على بيانات حقيقية.

الدالة التي سنستخدمها

تذكر أن هذه هي الدالة التي ستنجز لنا المهمة:

function removeDuplicates(array) {
  // استخدام الكائن Set الذي لا يقبل القيم المكررة
  // ثم استخدام معامل الانتشار (...) لتحويله مجدداً إلى مصفوفة
  return [...new Set(array)];
}

كما رأينا، تأخذ هذه الدالة مصفوفة كمدخل، وتُعيد مصفوفة جديدة تحتوي فقط على القيم الفريدة.

مثال عملي

لنفترض أن لدينا مصفوفة من البيانات الخام التي قد تحتوي على تكرارات، ونريد تنظيفها.

// 1. تعريف مصفوفة البيانات الخام التي تحتوي على تكرارات
const rawData = [1, 2, 2, 3, 4, 4, 5, "علي", "علي"];

// 2. استدعاء الدالة removeDuplicates لتنظيف البيانات
const cleanData = removeDuplicates(rawData);

// 3. عرض البيانات قبل وبعد التنظيف لمقارنة النتائج
console.log("البيانات قبل التنظيف:", rawData);
console.log("البيانات بعد التنظيف:", cleanData);

شرح الكود خطوة بخطوة

  1. const rawData = [1, 2, 2, 3, 4, 4, 5, "علي", "علي"];

    هنا نقوم بتعريف مصفوفة اسمها rawData. لاحظ أنها تحتوي على الأرقام 2 و 4 مكررة، بالإضافة إلى السلسلة النصية "علي" مكررة.

  2. const cleanData = removeDuplicates(rawData);

    في هذا السطر، نقوم باستدعاء الدالة removeDuplicates التي أنشأناها، ونمرر لها مصفوفة rawData كـ argument. ستقوم الدالة بمعالجة المصفوفة وإرجاع مصفوفة جديدة بدون تكرارات، والتي نخزنها في المتغير cleanData.

  3. console.log("البيانات قبل التنظيف:", rawData);

    نستخدم console.log لطباعة محتوى مصفوفة rawData الأصلية قبل أي تعديل، لمساعدتنا في مقارنة النتائج.

  4. console.log("البيانات بعد التنظيف:", cleanData);

    نستخدم console.log مرة أخرى لطباعة محتوى مصفوفة cleanData، وهي المصفوفة التي نتجت عن عملية إزالة التكرارات.

النتائج المتوقعة

عند تشغيل الكود أعلاه في متصفح الويب (من خلال أدوات المطور) أو في بيئة Node.js، ستلاحظ المخرجات التالية في الـ console:

البيانات قبل التنظيف: [1, 2, 2, 3, 4, 4, 5, "علي", "علي"]
البيانات بعد التنظيف: [1, 2, 3, 4, 5, "علي"]

كما ترى، تم إزالة جميع التكرارات بنجاح من المصفوفة الأصلية، وأصبحت لدينا مصفوفة تحتوي على قيم فريدة فقط.

جرب بنفسك!

لا تتردد في تعديل المصفوفة rawData بقيم مختلفة (أرقام، سلاسل نصية، قيم منطقية، وحتى كائنات) وشاهد كيف تتعامل الدالة removeDuplicates معها. هذا سيساعدك على فهم مدى قوة ومرونة هذا الأسلوب.

باستخدام هذه التقنية، يمكنك بسهولة تنظيف مجموعات البيانات الكبيرة وجعلها أكثر قابلية للإدارة والتحليل في تطبيقاتك.