JavaScript Arrays Iteration

تقوم طرق التكرار في المجموعة بمعالجة كل عنصر في المجموعة.

Array.forEach()

forEach() تدعو الطريقة الدالة (الدالة التدعيمية) مرة واحدة لكل عنصر في المجموعة.

مثال

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value, index, array) {
  txt = txt + value + "<br>"; 
}

جربها بنفسك

التعليق:تأخذ هذه الوظيفة 3 معلمات:

  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

استخدم المثال السابق فقط معامل القيمة. يمكن إعادة كتابة هذا المثال كالتالي:

مثال

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value) {
  txt = txt + value + "<br>"; 
}

جربها بنفسك

يدعم جميع المتصفحات Array.forEach()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

Array.map()

map() تخلق الطريقة مجموعة جديدة من خلال تنفيذ الدالة على كل عنصر في المجموعة.

map() الطريقة لن تنفذ الدالة على عناصر المجموعة التي لا تحتوي على قيمة.

map() الطريقة لن تغير المجموعة الأصلية.

هذا المثال يضاعف كل قيمة في المجموعة:

مثال

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value, index, array) {
  return value * 2;
}

جربها بنفسك

الرجاء الانتباه إلى أن هذه الوظيفة تأخذ 3 معلمات:

  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

عندما يستخدم الدالة التدعيمية فقط معامل القيمة، يمكن تهميش معاملات index و array:

مثال

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value) {
  return value * 2;
}

جربها بنفسك

يدعم جميع المتصفحات Array.map()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

Array.filter()

filter() تخلق الطريقة مجموعة جديدة تحتوي على العناصر التي اجتازت الاختبار.

هذا المثال يخلق مجموعة جديدة تحتوي على العناصر التي تزيد عن 18:

مثال

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

جربها بنفسك

يرجى ملاحظة أن هذه الوظيفة تأخذ 3 معلمات:

  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

في هذا المثال، لا يستخدم الدالة التدعيمية معلمتي index و array، لذا يمكن تهميشها:

مثال

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value) {
  return value > 18;
}

جربها بنفسك

يدعم جميع المتصفحات Array.filter()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

Array.reduce()

reduce() تعمل الطريقة على كل عنصر في المجموعة لتوليد (تقليله) قيمة واحدة.

reduce() تعمل الطريقة على المجموعة من اليسار إلى اليمين. انظر أيضًا إلى reduceRight().

reduce() الطريقة لن تقلل من المجموعة الأصلية.

هذا المثال يحدد مجموع جميع الأرقام في المجموعة:

مثال

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value, index, array) {
  return total + value;
}

جربها بنفسك

الرجاء الانتباه إلى أن هذه الوظيفة تأخذ 4 معلمات:

  • المجموع (القيمة الابتدائية / القيمة التي تم العودة إليها مسبقًا)
  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

لم يتم استخدام معلمات index و array في المثال السابق. يمكن تعديلها كالتالي:

مثال

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value) {
  return total + value;
}

جربها بنفسك

reduce() يمكن للطريقة أن تأخذ قيمة بداية:

مثال

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction, 100);
function myFunction(total, value) {
  return total + value;
}

جربها بنفسك

يدعم جميع المتصفحات Array.reduce()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

Array.reduceRight()

reduceRight() تعمل الطريقة على كل عنصر في المجموعة لتوليد (تقليله) قيمة واحدة.

reduceRight() تعمل الطريقة على المجموعة من اليمين إلى اليسار. انظر أيضًا إلى reduce().

reduceRight() الطريقة لن تقلل من المجموعة الأصلية.

هذا المثال يحدد مجموع جميع الأرقام في المجموعة:

مثال

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value, index, array) {
  return total + value;
}

جربها بنفسك

الرجاء الانتباه إلى أن هذه الوظيفة تأخذ 4 معلمات:

  • المجموع (القيمة الابتدائية / القيمة التي تم العودة إليها مسبقًا)
  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

لم يتم استخدام معلمات index و array في المثال السابق. يمكن تعديلها كالتالي:

مثال

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value) {
  return total + value;
}

جربها بنفسك

يدعم جميع المتصفحات Array.reduceRight()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

Array.every()

every() يبحث الطريقة عن ما إذا كانت جميع قيم المجموعة قد اجتازت الاختبار.

في هذا المثال، يتم التحقق مما إذا كانت جميع قيم المجموعة أكبر من 18:

مثال

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

جربها بنفسك

يرجى ملاحظة أن هذه الوظيفة تأخذ 3 معلمات:

  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

إذا كان يمكن التغاضي عن باقي المعلمات عند استخدام الدالة التراجعية (ال回调)، يمكن التغاضي عنها:

مثال

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value) {
  return value > 18;
}

جربها بنفسك

يدعم جميع المتصفحات Array.every()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

Array.some()

some() يبحث الطريقة عن ما إذا كانت بعض قيم المجموعة قد اجتازت الاختبار.

في هذا المثال، يتم التحقق مما إذا كانت بعض قيم المجموعة أكبر من 18:

مثال

var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

جربها بنفسك

يرجى ملاحظة أن هذه الوظيفة تأخذ 3 معلمات:

  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

يدعم جميع المتصفحات Array.some()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

Array.indexOf()

indexOf() يبحث الطريقة عن قيمة العنصر في المجموعة ويعود إلى موقعها.

التعليق:موقع العنصر الأول هو 0، وموقع العنصر الثاني هو 1، وهكذا.

مثال

البحث عن العنصر "Apple" في المجموعة:

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");

جربها بنفسك

يدعم جميع المتصفحات Array.indexOf()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

النحو

array.indexOf(العنصر, البداية)
العنصر مطلوب. العنصر الذي يتم البحث عنه.
البداية اختياري. من حيث البدء بالبحث. القيم السلبية تبدأ من الموقع المحدد من النهاية وتبحث حتى النهاية.

إذا لم يتم العثور على العنصر،Array.indexOf() يعود -1.

إذا كان العنصر يتكرر، فإنه يعود إلى موقع الظهور الأول.

Array.lastIndexOf()

Array.lastIndexOf() مع Array.indexOf() مثل ذلك، ولكن يبدأ البحث من نهاية المجموعة.

مثال

البحث عن العنصر "Apple" في المجموعة:

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");

جربها بنفسك

يدعم جميع المتصفحات Array.lastIndexOf()، باستثناء إصدار Internet Explorer 8 أو أقدم:

نعم 9.0 نعم نعم نعم

النحو

array.lastIndexOf(العنصر, البداية)
العنصر مطلوب. العنصر الذي يتم البحث عنه.
البداية اختياري. من حيث البدء في البحث. القيم السلبية ستبدأ من النهاية ومن الموضع المحدد وتنتقل إلى البداية.

Array.find()

find() يتم العودة بواسطة هذه الطريقة للقيمة الأولى التي ي通过了اختبار الوظيفة.

في هذا المثال، يتم البحث عن (العودة) القيمة الأولى التي هي أكبر من 18:

مثال

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

جربها بنفسك

يرجى ملاحظة أن هذه الوظيفة تأخذ 3 معلمات:

  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

المتصفحات القديمة لا تدعمها Array.find()فيما يلي قائمة بأول إصدار من المتصفح الذي يدعم هذه الطريقة بالكامل:

45 12 25 8 32

Array.findIndex()

findIndex() يتم العودة بواسطة هذه الطريقة لمؤشر العنصر الأول الذي ي通过了اختبار الوظيفة.

في هذا المثال، يتم البحث عن أول عنصر أكبر من 18 من خلال مؤشر العنصر:

مثال

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

جربها بنفسك

يرجى ملاحظة أن هذه الوظيفة تأخذ 3 معلمات:

  • قيمة العنصر
  • مؤشر العنصر
  • العدد نفسه

المتصفحات القديمة لا تدعمها Array.findIndex()فيما يلي قائمة بأول إصدار من المتصفح الذي يدعم هذه الطريقة بالكامل:

45 12 25 8 32