تكرار مصفوفة جافا سكريبت
تعمل طرق تكرار الصفيف على كل عنصر من عناصر المصفوفة.
مصفوفة JavaScript forEach ()
تستدعي forEach()الطريقة دالة (دالة رد نداء) مرة واحدة لكل عنصر مصفوفة.
مثال
const numbers = [45, 4, 9, 16, 25];
let txt = "";
numbers.forEach(myFunction);
function myFunction(value, index, array) {
txt += value + "<br>";
}
لاحظ أن الوظيفة تأخذ 3 وسيطات:
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
يستخدم المثال أعلاه معلمة القيمة فقط. يمكن إعادة كتابة المثال إلى:
مثال
const numbers = [45, 4, 9, 16, 25];
let txt = "";
numbers.forEach(myFunction);
function myFunction(value) {
txt += value + "<br>";
}
خريطة مصفوفة جافا سكريبت ()
الطريقة map()تنشئ مصفوفة جديدة عن طريق تنفيذ دالة على كل عنصر من عناصر المصفوفة.
لا تقوم map()الطريقة بتنفيذ الوظيفة لعناصر الصفيف بدون قيم.
الطريقة map()لا تغير المصفوفة الأصلية.
هذا المثال يضرب كل قيمة صفيف في 2:
مثال
const numbers1 = [45, 4, 9, 16, 25];
const numbers2 = numbers1.map(myFunction);
function myFunction(value, index, array) {
return value * 2;
}
لاحظ أن الوظيفة تأخذ 3 وسيطات:
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
عندما تستخدم دالة رد الاتصال معلمة القيمة فقط ، يمكن حذف معلمات الفهرس والمصفوفة:
مثال
const numbers1 = [45, 4, 9, 16, 25];
const numbers2 = numbers1.map(myFunction);
function myFunction(value) {
return value * 2;
}
مرشح مصفوفة JavaScript ()
تقوم filter()الطريقة بإنشاء مصفوفة جديدة مع عناصر مصفوفة تجتاز اختبارًا.
ينشئ هذا المثال مصفوفة جديدة من عناصر بقيمة أكبر من 18:
مثال
const numbers = [45, 4, 9, 16, 25];
const over18 = numbers.filter(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
لاحظ أن الوظيفة تأخذ 3 وسيطات:
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
في المثال أعلاه ، لا تستخدم وظيفة رد الاتصال معاملات الفهرس والمصفوفة ، لذلك يمكن حذفها:
مثال
const numbers = [45, 4, 9, 16, 25];
const over18 =
numbers.filter(myFunction);
function myFunction(value) {
return value > 18;
}
مصفوفة JavaScript تقليل ()
تقوم reduce()الطريقة بتشغيل دالة على كل عنصر مصفوفة لإنتاج (اختزالها إلى) قيمة واحدة.
تعمل reduce()الطريقة من اليسار إلى اليمين في المصفوفة. انظر أيضا reduceRight().
الطريقة reduce()لا تقلل من الصفيف الأصلي.
يجد هذا المثال مجموع كل الأرقام في المصفوفة:
مثال
const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction);
function myFunction(total, value, index, array) {
return total + value;
}
لاحظ أن الوظيفة تأخذ 4 وسيطات:
- الإجمالي (القيمة الأولية / القيمة التي تم إرجاعها سابقًا)
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
لا يستخدم المثال أعلاه معلمات الفهرس والصفيف. يمكن إعادة كتابتها إلى:
مثال
const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction);
function myFunction(total, value) {
return total + value;
}
يمكن reduce()للطريقة أن تقبل قيمة أولية:
مثال
const numbers = [45, 4, 9, 16, 25];
let sum = numbers.reduce(myFunction,
100);
function myFunction(total, value) {
return total + value;
}
مصفوفة جافا سكريبت تقلل إلى اليمين ()
تقوم reduceRight()الطريقة بتشغيل دالة على كل عنصر مصفوفة لإنتاج (اختزالها إلى) قيمة واحدة.
الأعمال reduceRight()من اليمين إلى اليسار في المصفوفة. انظر أيضا reduce().
الطريقة reduceRight()لا تقلل من الصفيف الأصلي.
يجد هذا المثال مجموع كل الأرقام في المصفوفة:
مثال
const numbers = [45, 4, 9, 16, 25];
let sum = numbers1.reduceRight(myFunction);
function myFunction(total, value, index, array) {
return total + value;
}
لاحظ أن الوظيفة تأخذ 4 وسيطات:
- الإجمالي (القيمة الأولية / القيمة التي تم إرجاعها سابقًا)
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
لا يستخدم المثال أعلاه معلمات الفهرس والصفيف. يمكن إعادة كتابتها إلى:
مثال
const numbers = [45, 4, 9, 16, 25];
let sum = numbers1.reduceRight(myFunction);
function myFunction(total, value) {
return total + value;
}
مصفوفة JavaScript كل ()
every()يتحقق هذا الأسلوب من اجتياز جميع قيم الصفيف للاختبار.
يتحقق هذا المثال مما إذا كانت جميع قيم الصفيف أكبر من 18:
مثال
const numbers = [45, 4, 9, 16, 25];
let allOver18 =
numbers.every(myFunction);
function myFunction(value, index, array) {
return
value > 18;
}
لاحظ أن الوظيفة تأخذ 3 وسيطات:
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
عندما تستخدم دالة رد الاتصال المعلمة الأولى فقط (القيمة) ، يمكن حذف المعلمات الأخرى:
مثال
const numbers = [45, 4, 9, 16, 25];
let allOver18 =
numbers.every(myFunction);
function myFunction(value) {
return
value > 18;
}
صفيف JavaScript بعض ()
يتحقق الأسلوب some()مما إذا كانت بعض قيم الصفيف تجتاز الاختبار.
يتحقق هذا المثال مما إذا كانت بعض قيم المصفوفات أكبر من 18:
مثال
const numbers = [45, 4, 9, 16, 25];
let someOver18 = numbers.some(myFunction);
function myFunction(value, index, array) {
return
value > 18;
}
لاحظ أن الوظيفة تأخذ 3 وسيطات:
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
مصفوفة JavaScript indexOf ()
تبحث الطريقة indexOf()في مصفوفة عن قيمة عنصر وتعيد موضعها.
ملاحظة: العنصر الأول في الموضع 0 ، والعنصر الثاني في الموضع 1 ، وهكذا.
مثال
ابحث في مصفوفة عن العنصر "Apple":
const fruits = ["Apple", "Orange", "Apple", "Mango"];
let position = fruits.indexOf("Apple") + 1;
بناء الجملة
array.indexOf(item, start)
| item | Required. The item to search for. |
| start | Optional. Where to start the search. Negative values will start at the given position counting from the end, and search to the end. |
Array.indexOf()إرجاع -1 إذا لم يتم العثور على العنصر.
إذا كان العنصر موجودًا أكثر من مرة ، فإنه يُرجع موضع التكرار الأول.
مصفوفة JavaScript lastIndexOf ()
Array.lastIndexOf()هو نفسه Array.indexOf()، لكنه يُرجع موضع التواجد الأخير للعنصر المحدد.
مثال
ابحث في مصفوفة عن العنصر "Apple":
const fruits = ["Apple", "Orange", "Apple", "Mango"];
let position = fruits.lastIndexOf("Apple") + 1;
بناء الجملة
array.lastIndexOf(item, start)
| item | Required. The item to search for |
| start | Optional. Where to start the search. Negative values will start at the given position counting from the end, and search to the beginning |
العثور على صفيف JavaScript ()
تُرجع هذه find()الطريقة قيمة أول عنصر صفيف يجتاز دالة اختبار.
يجد هذا المثال (يعرض قيمة) العنصر الأول الأكبر من 18:
مثال
const numbers = [4, 9, 16, 25, 29];
let first =
numbers.find(myFunction);
function myFunction(value, index, array) {
return
value > 18;
}
لاحظ أن الوظيفة تأخذ 3 وسيطات:
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
دعم المتصفح
find()هي ميزة ES6 (JavaScript 2015).
وهي مدعومة في جميع المتصفحات الحديثة:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
find()غير مدعوم في Internet Explorer.
FindIndex () مصفوفة JavaScript
تقوم findIndex()الطريقة بإرجاع فهرس عنصر الصفيف الأول الذي يجتاز دالة اختبار.
يجد هذا المثال فهرس العنصر الأول الأكبر من 18:
مثال
const numbers = [4, 9, 16, 25, 29];
let first =
numbers.findIndex(myFunction);
function myFunction(value, index, array) {
return
value > 18;
}
لاحظ أن الوظيفة تأخذ 3 وسيطات:
- قيمة العنصر
- فهرس العنصر
- المصفوفة نفسها
دعم المتصفح
findIndex()هي ميزة ES6 (JavaScript 2015).
وهي مدعومة في جميع المتصفحات الحديثة:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
findIndex()غير مدعوم في Internet Explorer.
مصفوفة جافا سكريبت. من ()
تقوم Array.from()الطريقة بإرجاع كائن Array من أي كائن بخاصية طول أو أي كائن قابل للتكرار.
مثال
إنشاء مصفوفة من سلسلة:
Array.from("ABCDEFG");
دعم المتصفح
from()هي ميزة ES6 (JavaScript 2015).
وهي مدعومة في جميع المتصفحات الحديثة:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
from()غير مدعوم في Internet Explorer.
مفاتيح صفيف JavaScript ()
تقوم Array.keys()الطريقة بإرجاع كائن Array Iterator بمفاتيح مصفوفة.
مثال
Create an Array Iterator object, containing the keys of the array:
const fruits = ["Banana", "Orange", "Apple", "Mango"];
const keys = fruits.keys();
for (let x of keys) {
text += x + "<br>";
}
Browser Support
keys() is an ES6 feature (JavaScript 2015).
It is supported in all modern browsers:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
keys() is not supported in Internet Explorer.
JavaScript Array includes()
ECMAScript 2016 introduced Array.includes() to arrays.
This allows us to check if an element is present in an array (including NaN, unlike indexOf).
Example
const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.includes("Mango"); // is true
Syntax
array.includes(search-item)
Array.includes() allows to check for NaN values. Unlike Array.indexOf().
Array.includes() is not supported in Internet Explorer and Edge 12/13.
The first browser versions with full support are:
Browser Support
includes() is an ECMAScript 2016 feature.
It is supported in all modern browsers:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
includes() is not supported in Internet Explorer.
Complete Array Reference
For a complete Array reference, go to our:
Complete JavaScript Array Reference.
The reference contains descriptions and examples of all Array properties and methods.