المصفوفات في

نبذة عن المصفوفات

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

لإنشاء مصفوفة، أضف العناصر بين الأقواس المربعة []. وللقراءة من المصفوفة، ضع الفهرس بين الأقواس المربعة [] بعد المعرّف. تبدأ فهارس المصفوفة من الصفر.

على سبيل المثال:

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names[1];
// => Laura

يمكن أيضًا إنشاء المصفوفات باستخدام صيغة البانية، لكن يُنصح بصيغة المصفوفة الحرفية في معظم الحالات.

const names = new Array();
names.push('Jack', 'Laura', 'Paul', 'Megan');

names[1];
// => Laura

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

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.length;
// => 4

// Properties can be set on arrays using bracket ['property'] or
// dot .property notation, and this will affect the length, as
// shown below.

names.magician = 'Elyse';
names.length;
// => 4

// The property shows up when logging the array, making it seem
// that the property is somehow incorporated in the array.

names;
// => ["Jack", "Laura", "Paul", "Megan", magician: "Elyse"]

// However, be aware. Properties added via non-numeric keys are
// NOT part of the array's internal list, and are not traversed
// or mutated when using one of the traversal or mutation
// operations.

names.forEach((name) => console.log(name));
// => Jack
// => Laura
// => Paul
// => Megan

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

المصفوفات في JavaScript هي objects عادية، ويمكن حذف العناصر باستخدام الكلمة المفتاحية delete. لكن هذا لا يغيّر طول المصفوفة، بل يترك فراغًا من empty. في لغات أخرى، يشبه هذا المصفوفة المتفرقة. تُتخطى فراغات empty عند استخدام عمليات الاجتياز أو التعديل.

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
delete names[1];

names;
// =>  ["Jack", empty, "Paul", "Megan"]

names.length;
// => 4

names.forEach((name) => console.log(name));
// => Jack
// => Paul
// => Megan

إذا كنت لا تريد أي فراغات، وإذا أردت أن تعكس length عدد العناصر التي ستُجتاز أو تُعدّل، فاستخدم splice بدلًا من ذلك.

تُغيّر طريقة splice() محتويات المصفوفة عبر إزالة العناصر الموجودة أو استبدالها و/أو إضافة عناصر جديدة في مكانها.¹

على سبيل المثال:

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.splice(1, 1);

names;
// =>  ["Jack", "Paul", "Megan"]

names.length;
// => 3

names.forEach((name) => console.log(name));
// => Jack
// => Paul
// => Megan

يمكن تغيير طول المصفوفة

ترتبط خاصية length في المصفوفة بقائمة العناصر التي تحتفظ بها المصفوفة. ويمكن تغييرها. عند زيادة الطول، تُنشئ فراغات empty لا تُؤخذ في الحسبان عند اجتياز المصفوفة أو تعديلها. وعند تقليل الطول، فإنه يحذف العناصر في نهاية المصفوفة.

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.length = 6;

names;
// => ["Jack", "Laura", "Paul", "Megan", empty × 2]

names.length = 2;
// =>  ["Jack", "Laura"]

التحقق مما إذا كان شيء ما مصفوفة

لأن المصفوفات هي objects، فإن typeof names يعطي "object". وللتحقق مما إذا كان شيء ما مصفوفة، استخدم Array.isArray:

const names = ['Jack', 'Laura', 'Paul', 'Megan'];

typeof names;
// => "object"

Array.isArray(names);
// => true

const object = {};
Array.isArray(object);
// => false

قد تميل إلى استخدام names instanceof Array، وهذا قد ينجح، لكن ليس في كل الحالات. اقرأ هذا المقال لمزيد من المعلومات.

طرق المصفوفة

يمكن استخدام بعض الطرق المتاحة على كل كائن مصفوفة لإضافة عناصر إلى المصفوفة أو حذفها منها. إليك بعضًا منها:

push

تضيف طريقة push() عنصرًا واحدًا أو أكثر إلى نهاية المصفوفة، وتُرجع الطول الجديد للمصفوفة.²

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.push('Jill'); // => 5
names;
// => ['Jack', 'Laura', 'Paul', 'Megan', 'Jill']

pop

تحذف طريقة pop() العنصر الأخير من المصفوفة وتُرجع ذلك العنصر. وتغيّر هذه الطريقة طول المصفوفة.³

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.pop(); // => 'Megan'
names;
// => ['Jack', 'Laura', 'Paul']

shift

تحذف طريقة shift() العنصر الأول من المصفوفة وتُرجع العنصر المحذوف. وتغيّر هذه الطريقة طول المصفوفة.⁴

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.shift(); // => 'Jack'
names;
// => ['Laura', 'Paul', 'Megan']

unshift

تضيف طريقة unshift() عنصرًا واحدًا أو أكثر إلى بداية المصفوفة وتُرجع الطول الجديد للمصفوفة.⁵

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.unshift('Jill'); // => 5
names;
// => ['Jill', 'Jack', 'Laura', 'Paul', 'Megan']

splice

تُغيّر طريقة splice() محتويات المصفوفة عبر إزالة العناصر الموجودة أو استبدالها و/أو إضافة عناصر جديدة في مكانها. وتُرجع هذه الطريقة مصفوفة تحتوي على العناصر المحذوفة.¹

const names = ['Jack', 'Laura', 'Paul', 'Megan'];
names.splice(2, 1, 'Jill'); // => ['Paul']
names;
// => ['Jack', 'Laura', 'Jill', 'Megan']

---

1. splice, MDN. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice (مرجع بتاريخ 29 سبتمبر 2021) ↩

2. push, MDN. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push (مرجع بتاريخ 29 سبتمبر 2021) ↩

3. pop, MDN. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop (مرجع بتاريخ 29 سبتمبر 2021) ↩

4. shift, MDN. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift (مرجع بتاريخ 29 سبتمبر 2021) ↩

5. unshift, MDN. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift (مرجع بتاريخ 29 سبتمبر 2021) ↩