for في JavaScript

من موسوعة حسوب

التعبير البرمجي for يُنشِئ حلقة تكرار تتألف من ثلاثة تعبيرات برمجية اختيارية تحيط بها أقواس وتفصل بينها فواصل منقوطة، ويليها تعبيرٌ برمجيٌ (وعادةً يكون قسمًا كتليًا [block statement]) سيُنفَّذ في كل تكرار للحلقة.

البنية العامة

for ([initialization]; [condition]; [final-expression])
   statement

initialization

تعبير (يتضمن تعابير الإسناد) أو تصريح عن متغير، ويُستخدَم عادةً لتهيئة متغير العدّاد؛ وهذا التعبير قد يُصرِّح اختياريًا عن متغيرات جديدة باستخدام الكلمة المحجوزة var؛ وهذه المتغيرات ليست محليةً وتابعةً لحلقة التكرار، وإنما ستكون موجودةً في نفس المجال الذي تكون حلقة التكرار for موجودةً فيه.

condition

تعبيرٌ سيتم التحقق من صحته قبل كل تكرار، وإذا كانت قيمة الشرط condition هي true فسينفَّذ التعبير البرمجي statement، لاحظ أنَّ هذا الشرط اختياريٌ، وإذا لم يُحدَّد فسيُعدّ على أنه true دومًا، وإذا كانت قيمة الشرط condition تساوي false فسينتقل تنفيذ البرنامج إلى التعبير البرمجي الذي يلي حلقة for.

final-expression

التعبير الذي سيُنفَّذ بعد نهاية كل تكرار، وهو يحدث قبل عملية التحقق من صحة الشرط condition في المرة التالية، ويُستخدَم عادةً لتحديث أو زيادة قيمة متغير العداد.

statement

التعبير البرمجي الذي سيُنفَّذ لطالما كانت قيمة الشرط هي true، ولتنفيذ عدِّة تعابير برمجية ضمن حلقة التكرار فاستخدم الأقسام الكتلية (block statement) لتجميع هذه التعابير البرمجية، أما إذا لم تشأ تنفيذ أيّة تعابير برمجية في الحلقة فاستخدم التعبير البرمجي الفارغ (empty statement).

أمثلة

استخدام for

حلقة التكرار for الآتية تبدأ بالتصريح عن المتغير i وتهيئة قيمته إلى القيمة 0، ثم ستتحقق أنَّ قيمة i أقل من 9، ثم تُنفِّذ التعبيرين البرمجيين (إنشاء قسم كتلي [block statement] والكتابة إلى سطر الأوامر [console.log()‎])، ثم تزيد قيمة المتغير i بمقدار 1 بعد كل تكرار.

for (var i = 0; i < 9; i++) {
   console.log(i);
   // ...
}

تعابير for الاختيارية

تذكر أنَّ التعابير الثلاثة في بداية حلقة for هي تعابير اختيارية، فمن الممكن ألّا تكون هنالك حاجةٌ إلى تعبير initialization الذي يُستخدَم لتهيئة المتغيرات:

var i = 0;
for (; i < 9; i++) {
    console.log(i);
    // ...
}

وكما في تعبير التهيئة (initialization) فإنَّ تعبير الشرط (condition) هو تعبيرٌ اختياريٌ أيضًا، لكن إن أردتَ حذفه فاحرص على الخروج من حلقة التكرار (break) لئلا تُنشِئ حلقة تكرار لا نهائية:

for (var i = 0;; i++) {
   console.log(i);
   if (i > 3) break;
   // ...
}

يمكنك أيضًا حذف التعابير الاختيارية الثلاثة، لكن احرص على استخدام تعبير break للخروج من الحلقة، ولا تنسَ تعديل قيمة المتغير (العدّاد)، لكي يكون شرط الخروج من حلقة التكرار محققًا في مرحلةٍ ما من تنفيذ حلقة التكرار.

var i = 0;

for (;;) {
  if (i > 3) break;
  console.log(i);
  i++;
}

استخدام for دون تعبير برمجي يليها

حلقة التكرار for الآتية تحسب إزاحة موضع إحدى العقد العناصر في التعبير final-expression، فهي تُهيِّئ المتغير oItNode في قسم initialization، ثم تختبر إن كان العنصر موجودًا في المستند إذا كانت قيمة المتغير oItNode تساوي true وذلك في قسم condition، لاحظ عدم الحاجة إلى استخدام تعابير برمجية، لذا وضعنا تعبيرًا برمجيًا فارغًا (empty statement):

function showOffsetPos(sId) {

  var nLeft = 0, nTop = 0;

  for (

    var oItNode = document.getElementById(sId); /* initialization */

      oItNode; /* condition */

    nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent /* final-expression */

  ); /* فاصلة منقوطة */ 

  console.log('Offset position of \'' + sId + '\' element:\n left: ' + nLeft + 'px;\n top: ' + nTop + 'px;');

}

/* تجربة الدالة السابقة */

showOffsetPos('content');

// الناتج
// "Offset position of "content" element:
// left: 0px;
// top: 153px;"

ملاحظة: هذه حالة من الحالات القليلة التي يكون فيها استخدام الفاصلة المنقوطة إجباريًا؛ فإن لم نستعملها فسيُنفَّذ السطر الذي يلي التعبير for في كل تكرار وسيُعدّ على أنَّه قسم statement من حلقة التكرار.

دعم المتصفحات

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي نعم نعم نعم نعم نعم

مصادر ومواصفات