البرمجة

مصفوفات جافاسكريبت: دليل شامل

اخر تحديث 08/06/2025
14 تمت قراءة 4 دقيقة
جدول المحتوى

جافاسكريبت والمصفوفات: دراسة معمقة حول JavaScript Array

تُعدّ المصفوفات (Arrays) من أهم الهياكل الأساسية في لغة جافاسكريبت (JavaScript)، وهي تلعب دورًا جوهريًا في تخزين البيانات وتنظيمها وإدارتها داخل البرامج والتطبيقات. تعتبر المصفوفات طريقة فعالة لتجميع مجموعة من القيم المتشابهة أو المختلفة في مكان واحد يمكن الوصول إليه بواسطة الفهرس (Index). في هذا المقال المطول سنغوص بعمق في مفهوم المصفوفة في جافاسكريبت، كيفية إنشائها، التعامل معها، الأساليب والوظائف المدمجة التي توفرها اللغة، وأفضل الممارسات في استخدامها لتحقيق أفضل أداء وكفاءة في التطبيقات.

تعريف المصفوفة في جافاسكريبت

المصفوفة في جافاسكريبت هي كائن (Object) يُستخدم لتخزين عدة قيم في متغير واحد. يتم تخزين هذه القيم بترتيب محدد، ويمكن الوصول إليها باستخدام أرقام الفهارس التي تبدأ من الصفر. على عكس لغات برمجة أخرى، جافاسكريبت تسمح للمصفوفة بأن تحتوي على عناصر من أنواع بيانات مختلفة في نفس الوقت، مثل أعداد صحيحة، نصوص، كائنات، دوال، وحتى مصفوفات أخرى.

مواضيع ذات صلة
javascript
let arr = [1, 'text', true, {name: 'John'}, [10, 20]];

في المثال أعلاه، يحتوي المتغير arr على مصفوفة تضم أنواع بيانات متعددة من أعداد ونصوص وكائنات ومصفوفات أخرى.

إنشاء المصفوفات في جافاسكريبت

هناك عدة طرق لإنشاء المصفوفات، وأكثرها شيوعًا هو استخدام الأقواس المربعة []، حيث يتم إدخال القيم مفصولة بفواصل.

الطريقة الأولى: الأقواس المربعة

javascript
let fruits = ['تفاح', 'موز', 'كرز'];

الطريقة الثانية: باستخدام المُنشئ Array()

javascript
let numbers = new Array(1, 2, 3, 4);

الطريقة الثالثة: إنشاء مصفوفة فارغة ثم تعبئتها

javascript
let colors = [];
colors[0] = 'أحمر';
colors[1] = 'أزرق';

يُفضل استخدام الطريقة الأولى في العادة، حيث تعتبر أكثر وضوحًا وأسهل قراءة.

خصائص المصفوفات في جافاسكريبت

  • الطول (length): خاصية تقيس عدد العناصر في المصفوفة.

javascript
let arr = [1, 2, 3];
console.log(arr.length); // الناتج: 3

  • المؤشر (Index): يستخدم للوصول إلى عناصر المصفوفة، يبدأ من الصفر.

  • ديناميكية الطول: يمكن إضافة أو حذف عناصر في أي وقت، مما يجعل المصفوفة في جافاسكريبت مرنة جدًا.

الوصول إلى عناصر المصفوفة وتعديلها

يمكن الوصول إلى أي عنصر في المصفوفة عن طريق رقم الفهرس.

javascript
let animals = ['كلب', 'قط', 'أرنب'];
console.log(animals[1]); // القط

ولتعديل عنصر:

javascript
animals[2] = 'حصان';

إضافة وحذف العناصر

إضافة عنصر في نهاية المصفوفة

تستخدم دالة push() لإضافة عنصر أو أكثر في نهاية المصفوفة.

javascript
animals.push('نمر');

إضافة عنصر في بداية المصفوفة

تستخدم دالة unshift().

javascript
animals.unshift('أسد');

حذف عنصر من نهاية المصفوفة

تستخدم دالة pop()، التي تحذف العنصر الأخير وتُرجع قيمته.

javascript
let lastAnimal = animals.pop();

حذف عنصر من بداية المصفوفة

تستخدم دالة shift().

javascript
let firstAnimal = animals.shift();

حذف عناصر في منتصف المصفوفة

تستخدم دالة splice()، والتي تسمح بإضافة أو حذف عناصر من موقع معين.

javascript
animals.splice(1, 1); // حذف عنصر واحد من الموقع 1

طرق البحث عن العناصر في المصفوفة

تقدم جافاسكريبت عدة طرق مدمجة للبحث عن عناصر داخل المصفوفات، منها:

  • indexOf() — تعيد أول موقع لعنصر معين، أو -1 إذا لم يُعثر عليه.

javascript
let idx = animals.indexOf('قط'); // يعيد 1 أو -1 إذا غير موجود

  • lastIndexOf() — تبحث عن آخر ظهور للعنصر.

  • includes() — تعيد true إذا كان العنصر موجودًا، false إذا لم يكن.

javascript
let found = animals.includes('حصان'); // true أو false

  • find() — تبحث عن أول عنصر يحقق شرطًا معينًا يُعبر عنه بدالة.

javascript
let found = animals.find(animal => animal.startsWith('ح'));

  • filter() — تعيد مصفوفة جديدة تحتوي على كل العناصر التي تحقق شرطًا معينًا.

التكرار على عناصر المصفوفة

التكرار هو عملية مهمة جدًا، ويوجد عدة طرق للقيام بذلك:

1. باستخدام الحلقة for

javascript
for(let i = 0; i < animals.length; i++) {
  console.log(animals[i]);
}

2. باستخدام for...of

javascript
for (let animal of animals) {
  console.log(animal);
}

3. باستخدام forEach()

طريقة مدمجة في جافاسكريبت لتنفيذ دالة على كل عنصر.

javascript
animals.forEach(function(animal) {
  console.log(animal);
});

تحويل المصفوفات إلى سلاسل نصية والعكس

تحويل مصفوفة إلى نص

تستخدم دالة join() التي تربط عناصر المصفوفة بسلسلة نصية مفصولة بفاصل معين.

javascript
let text = animals.join(', ');
console.log(text); // "كلب, قط, حصان"

تحويل نص إلى مصفوفة

تستخدم دالة split() على السلاسل النصية.

javascript
let words = "تفاح, موز, كرز".split(', ');

التعامل مع مصفوفات متعددة الأبعاد

المصفوفات يمكن أن تحتوي على مصفوفات أخرى بداخلها، مثل المصفوفة الثنائية الأبعاد (مصفوفة مصفوفات).

javascript
let matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

يمكن الوصول إلى العنصر في الصف الثاني والعمود الثالث كالتالي:

javascript
console.log(matrix[1][2]); // 6

الدوال الشائعة والمهمة للمصفوفات في جافاسكريبت

الوظيفة الوصف مثال الاستخدام
push() إضافة عنصر في نهاية المصفوفة arr.push(5);
pop() حذف آخر عنصر من المصفوفة arr.pop();
shift() حذف أول عنصر من المصفوفة arr.shift();
unshift() إضافة عنصر في بداية المصفوفة arr.unshift(1);
splice() حذف/إضافة عناصر من/إلى المصفوفة arr.splice(2,1);
slice() استخراج جزء من المصفوفة دون تعديل الأصل arr.slice(1,3);
indexOf() إيجاد موقع عنصر في المصفوفة arr.indexOf(3);
includes() التحقق من وجود عنصر في المصفوفة arr.includes(4);
forEach() تنفيذ دالة على كل عنصر arr.forEach(item => console.log(item));
map() إنشاء مصفوفة جديدة عن طريق تطبيق دالة على كل عنصر arr.map(x => x * 2);
filter() إنشاء مصفوفة جديدة تحتوي على عناصر تحقق شرطًا arr.filter(x => x > 10);
reduce() دمج قيم المصفوفة في قيمة واحدة arr.reduce((acc, x) => acc + x, 0);

الفرق بين المصفوفات والكائنات في جافاسكريبت

رغم أن المصفوفات هي نوع من الكائنات في جافاسكريبت، إلا أن هناك اختلافات مهمة:

  • المصفوفة تستخدم لترتيب العناصر وفقًا لترتيب رقمي يبدأ من صفر.

  • الكائن (Object) يستخدم لتخزين أزواج المفتاح والقيمة، حيث المفتاح يكون غالبًا نصيًا.

التحديات والملاحظات المتعلقة بالمصفوفات في جافاسكريبت

  • الأداء مع المصفوفات الكبيرة: عند التعامل مع مصفوفات ضخمة، بعض العمليات مثل splice() أو shift() قد تكون مكلفة من ناحية الأداء بسبب إعادة ترتيب العناصر.

  • المصفوفات المتجانسة مقابل غير المتجانسة: يفضل أحيانًا استخدام المصفوفات التي تحتوي على نوع واحد من البيانات لزيادة الوضوح والكفاءة، رغم أن جافاسكريبت تسمح بخلط الأنواع.

  • المصفوفات Sparse (المصفوفات المتفرقة): هي مصفوفات تحتوي على فراغات أو عناصر غير معرفة، وهذا قد يؤدي إلى سلوك غير متوقع في بعض العمليات.

javascript
let sparseArr = [];
sparseArr[5] = 'value';
console.log(sparseArr.length); // 6

استخدام المصفوفات في برمجة الويب الحديثة

في التطبيقات الحديثة، لا تقتصر أهمية المصفوفات على التخزين فقط، بل تعد جزءًا أساسيًا من معالجة البيانات، التفاعل مع واجهات المستخدم، وعمليات البرمجة الوظيفية (Functional Programming).

على سبيل المثال، في إطار React، تُستخدم المصفوفات لعرض قوائم العناصر بشكل ديناميكي.

jsx
const fruits = ['تفاح', 'موز', 'كرز'];

function FruitList() {
  return (
    <ul>
      {fruits.map(fruit => <li key={fruit}>{fruit}li>)}
    ul>
  );
}

ملخص شامل حول المصفوفات في جافاسكريبت

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

تُستخدم المصفوفات في أغلب تطبيقات جافاسكريبت سواء البسيطة أو المعقدة، حيث تسهل عملية إدارة البيانات، التكرار عليها، التصفية، والفرز، بالإضافة إلى عمليات التحويل والتجميع.

مصادر ومراجع

  1. MDN Web Docs – Arrays: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

  2. JavaScript: The Definitive Guide – David Flanagan (كتاب مرجعي شامل)

بهذا تم استعراض شامل ومفصل لمفهوم المصفوفات في جافاسكريبت، مميزات وأدوات التعامل معها، والطرق المثلى لاستخدامها في تطوير البرمجيات الحديثة.

اخر تحديث 08/06/2025
14 تمت قراءة 4 دقيقة