استخدام الـ Spread Syntax في الـ Arrays
جزء من قسم Logic & Flow في رحلة JavaScript على Coddy — الدرس 48 من 65.
تسمح صيغة النشر (...) للكائنات القابلة للتكرار (iterable)، مثل المصفوفة (array)، بأن يتم توسيعها في الأماكن التي يُتوقع فيها وجود وسيطة (argument) واحدة أو أكثر أو عنصر واحد أو أكثر. وهي توفر طريقة مختصرة لإجراء عمليات مثل دمج المصفوفات أو نسخها.
فيما يلي بعض حالات الاستخدام الشائعة:
1. دمج المصفوفات:
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = [...arr1, ...arr2];
console.log(combined); // [1, 2, 3, 4, 5, 6]2. إنشاء نسخة ضحلة (shallow copy) من مصفوفة:
const original = [1, 2, 3];
const copy = [...original];
console.log(copy); // [1, 2, 3]3. إضافة عناصر إلى مصفوفة:
const numbers = [1, 2, 3];
const moreNumbers = [0, ...numbers, 4];
console.log(moreNumbers); // [0, 1, 2, 3, 4]4. تمرير عناصر المصفوفة كوسيطات للدالة:
function sum(a, b, c) {
return a + b + c;
}
const numbers = [1, 2, 3];
console.log(sum(...numbers)); // 6
التحدي
سهلأنشئ دالة تسمى mergeArr تأخذ مصفوفتين من الأرقام كوسطاء. يجب أن تقوم الدالة بما يلي:
- دمج المصفوفتين باستخدام عامل النشر (spread operator)
- إزالة أي أرقام مكررة
- إرجاع المصفوفة الناتجة
ورقة مرجعية
تسمح صيغة النشر (...) بتوسيع الكائنات القابلة للتكرار (iterable) في الأماكن التي يُتوقع فيها وجود وسيط واحد أو أكثر أو عناصر.
دمج المصفوفات:
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = [...arr1, ...arr2];
console.log(combined); // [1, 2, 3, 4, 5, 6]إنشاء نسخة ضحلة (shallow copy):
const original = [1, 2, 3];
const copy = [...original];
console.log(copy); // [1, 2, 3]إضافة عناصر إلى مصفوفة:
const numbers = [1, 2, 3];
const moreNumbers = [0, ...numbers, 4];
console.log(moreNumbers); // [0, 1, 2, 3, 4]تمرير عناصر المصفوفة كوسائط للدالة:
function sum(a, b, c) {
return a + b + c;
}
const numbers = [1, 2, 3];
console.log(sum(...numbers)); // 6جرّب بنفسك
function mergeArr(arr1, arr2) {
// اكتب الكود الخاص بك هنا
}
اختبر نفسكيتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.
جميع دروس Logic & Flow
1السلاسل النصية بعمق
أساسيات السلاسل النصيةالتكرار عبر السلاسل النصيةTemplate Literalsدوال السلاسل النصيةمراجعة - String Weaver
2المصفوفات متعددة الأبعاد
أساسيات المصفوفات ثنائية الأبعادالوصول إلى عناصر المصفوفات ثنائية الأبعادالحلقات المتداخلة مع المصفوفات ثنائية الأبعادمراجعة - المصفوفات ثنائية الأبعادجمع وطرح المصفوفاتالمصفوفات المتعرجة (Jagged Arrays)المصفوفات ثلاثية الأبعاد وما بعدهاأنماط المصفوفات ثنائية الأبعاد الشائعةمراجعة - كل شيء عن المصفوفات5المجموعات - الجزء الأول
ما هي المجموعة؟التكرار عبر المجموعاتإضافة عنصرإزالة عنصرالتحقق من وجود عنصرالحجم وهل هي فارغةالنسخ والمسحملخص - أساسيات المجموعات8مواضيع شيقة حول الـ Arrays
تفكيك الـ Arrayاستخدام الـ Spread Syntax في الـ Arraysالـ Sparse Arraysمراجعة - ورشة عمل الـ Arrays3JSON الجزء الأول
ما هو JSON؟التحقق من وجود المفتاحObject MethodsSpread Operator الجزء الأولSpread Operator الجزء الثانيحذف المفاتيحمراجعة - معالجة مفاتيح JSON