الدرس السابع: المصفوفات (Arrays) في JavaScript – شرح موسع وشامل
المصفوفات هي واحدة من أبرز الهياكل البياناتية في JavaScript، وتُمثل وسيلة فعّالة لتخزين مجموعات البيانات والعمل عليها بطريقة مرتبة ومنظمة. سواء كنت ترغب في تخزين أرقام، نصوص، كائنات، أو حتى مصفوفات أخرى، فإن المصفوفات تقدم لك حلاً مرنًا وسهل الاستخدام. في هذا الدرس، سنتناول جميع التفاصيل المتعلقة بالمصفوفات، بدءًا من تعريفها وصولاً إلى استخداماتها المتقدمة.
1. تعريف المصفوفات (Arrays)
المصفوفة هي بنية بيانات تُستخدم لتخزين مجموعة من القيم داخل متغير واحد. يتم تخزين هذه القيم بترتيب معين ويُشار إلى كل قيمة منها بفهرس (Index) يبدأ من الرقم 0.
مثال على مصفوفة بسيطة:
let fruits = ["Apple", "Banana", "Cherry"];
- الفهرس 0: “Apple”
- الفهرس 1: “Banana”
- الفهرس 2: “Cherry”
لماذا نستخدم المصفوفات؟
- لتقليل الحاجة إلى إنشاء عدة متغيرات.
- لتخزين البيانات المرتبطة بطريقة منطقية.
- لتسهيل العمليات الحسابية أو المنطقية على مجموعة من البيانات.
2. كيفية إنشاء المصفوفات في JavaScript
باستخدام الأقواس المربعة []:
let numbers = [1, 2, 3, 4, 5];
let colors = ["Red", "Green", "Blue"];
باستخدام الكائن Array:
let numbers = new Array(1, 2, 3, 4, 5);
إنشاء مصفوفة فارغة:
let emptyArray = [];
إنشاء مصفوفة تحتوي على أنواع بيانات متعددة:
let mixedArray = [42, "Hello", true, { name: "Ali" }, [1, 2, 3]];
3. العمليات الأساسية على المصفوفات
الوصول إلى العناصر:
باستخدام الفهرس:
let fruits = ["Apple", "Banana", "Cherry"];
console.log(fruits[0]); // "Apple"
console.log(fruits[2]); // "Cherry"
تعديل القيم:
let fruits = ["Apple", "Banana", "Cherry"];
fruits[1] = "Orange";
console.log(fruits); // ["Apple", "Orange", "Cherry"]
معرفة طول المصفوفة:
let fruits = ["Apple", "Banana", "Cherry"];
console.log(fruits.length); // 3
4. إضافة وإزالة العناصر
إضافة العناصر:
إلى النهاية باستخدام push:
let fruits = ["Apple", "Banana"];
fruits.push("Cherry");
console.log(fruits); // ["Apple", "Banana", "Cherry"]
إلى البداية باستخدام unshift:
let fruits = ["Apple", "Banana"];
fruits.unshift("Mango");
console.log(fruits); // ["Mango", "Apple", "Banana"]
إزالة العناصر:
من النهاية باستخدام pop:
let fruits = ["Apple", "Banana", "Cherry"];
fruits.pop();
console.log(fruits); // ["Apple", "Banana"]
من البداية باستخدام shift:
let fruits = ["Apple", "Banana"];
fruits.shift();
console.log(fruits); // ["Banana"]
5. التكرار عبر المصفوفات
باستخدام الحلقة for:
let fruits = ["Apple", "Banana", "Cherry"];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
باستخدام الحلقة forEach:
let fruits = ["Apple", "Banana", "Cherry"];
fruits.forEach(fruit => console.log(fruit));
6. دوال متقدمة للتعامل مع المصفوفات
map:
تُستخدم لإنشاء مصفوفة جديدة عن طريق تطبيق دالة على كل عنصر في المصفوفة الأصلية.
مثال:
let numbers = [1, 2, 3, 4];
let squared = numbers.map(num => num * num);
console.log(squared); // [1, 4, 9, 16]
filter:
تُنشئ مصفوفة جديدة تحتوي فقط على العناصر التي تحقق شرطًا معينًا.
مثال:
let numbers = [1, 2, 3, 4];
let evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // [2, 4]
reduce:
تُدمج جميع عناصر المصفوفة في قيمة واحدة باستخدام دالة تراكمية.
مثال:
let numbers = [1, 2, 3, 4];
let sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum); // 10
7. البحث داخل المصفوفات
البحث عن موقع عنصر باستخدام indexOf:
let fruits = ["Apple", "Banana", "Cherry"];
console.log(fruits.indexOf("Banana")); // 1
console.log(fruits.indexOf("Mango")); // -1
التحقق من وجود عنصر باستخدام includes:
let fruits = ["Apple", "Banana", "Cherry"];
console.log(fruits.includes("Cherry")); // true
console.log(fruits.includes("Mango")); // false
8. المصفوفات متعددة الأبعاد
تعريف:
هي مصفوفات تحتوي على مصفوفات كعناصر.
مثال:
let matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
console.log(matrix[1][2]); // 6
9. التعامل مع النصوص باستخدام المصفوفات
تحويل النص إلى مصفوفة باستخدام split:
let sentence = "Hello World";
let words = sentence.split(" ");
console.log(words); // ["Hello", "World"]
تحويل المصفوفة إلى نص باستخدام join:
let words = ["Hello", "World"];
let sentence = words.join(" ");
console.log(sentence); // "Hello World"
10. فرز وترتيب المصفوفات
ترتيب العناصر تصاعديًا باستخدام sort:
let numbers = [4, 2, 9, 1];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 2, 4, 9]
ترتيب العناصر تنازليًا باستخدام reverse:
let numbers = [1, 2, 3];
numbers.reverse();
console.log(numbers); // [3, 2, 1]
الخاتمة
المصفوفات في JavaScript تُعتبر حجر الزاوية لتطوير تطبيقات قوية ومُعقدة. تعلمك لهذه الأساسيات والتقنيات المتقدمة سيمنحك الأدوات اللازمة للعمل بفعالية مع البيانات. مع التمرين المستمر، ستصبح قادرًا على استغلال إمكانياتها بشكل كامل لتحسين كفاءة وسلاسة تطبيقاتك.
اكتشاف المزيد من كود التطور
اشترك للحصول على أحدث التدوينات المرسلة إلى بريدك الإلكتروني.
