جافا سكريبت للحلقة
مثال
قم بتكرار (تكرار) كتلة التعليمات البرمجية خمس مرات:
for (let i = 0; i < 5; i++) {
text += i + "<br>";
}
حلقة (كرر) مصفوفة لجمع أسماء السيارات:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
for (let i = 0; i < cars.length; i++) {
text += cars[i] + "<br>";
}
- تبدأ الحلقة في الموضع 0 (
let i = 0
). - تتزايد الحلقة تلقائيًا
i
لكل شوط. - الحلقة تعمل طالما
i < cars.length
.
المزيد من الأمثلة أدناه.
التعريف والاستخدام
تحدد العبارة for
كتلة التعليمات البرمجية التي يتم تنفيذها طالما أن الشرط هو
true
.
ملحوظة
إذا حذفت العبارة 2 ، فيجب عليك توفير فاصل داخل الحلقة.
وإلا فإن الحلقة لن تنتهي أبدا. هذا سوف يحطم متصفحك.أنظر أيضا:
بناء الجملة
for (statement 1; statement 2; statement 3) {
code block to be executed
}
المعلمات
Parameter | Description |
statement 1 | Optional. Executed before the code block starts. Normally used to initialize a counter variable. To initiate multiple values, separate each value with a comma. This parameter can be omitted, but not the semicolon ";" |
statement 2 | Optional. The condition for running the code block. If it returns true the loop will start over again, otherwise the loop will end.This parameter can be omitted, but not the semicolon ";" |
statement 3 | Optional. Executed after the code block. Normally used to increment the counter variable. This parameter can be omitted (e.g. to increase/decrease values inside the loop) |
جمل حلقة جافا سكريبت
بيان - تصريح | وصف | |
فترة راحة | يقطع الحلقة | |
استمر | يتخطى قيمة في حلقة | |
في حين | حلقات كتلة التعليمات البرمجية عندما يكون الشرط صحيحًا | |
افعل اثناء | يقوم بتكرار كتلة التعليمات البرمجية مرة واحدة ، ثم أثناء كون الشرط صحيحًا | |
ل | حلقات كتلة التعليمات البرمجية عندما يكون الشرط صحيحًا | |
لـ ... من | حلقات لقيم أي قابل للتكرار | |
لـ ... في | حلقات خصائص الكائن |
مزيد من الأمثلة
ابدأ قيمًا متعددة في المعلمة الأولى:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
for (let i = 0, len = cars.length, text = ""; i < len; i++) {
text += cars[i] + "<br>";
}
احذف المعلمات الأولى (اضبط القيم قبل أن تبدأ الحلقة):
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 2;
let len = cars.length;
let text = "";
for (; i < len; i++) {
text += cars[i] + "<br>";
}
استخدام continue
- التكرار خلال كتلة من التعليمات البرمجية ، ولكن تخطي القيمة 3:
let text = "";
for (let i = 0; i < 5; i++) {
if (i == 3) continue;
text += i + "<br>";
}
الاستخدام break
- قم بتكرار مقطع التعليمات البرمجية ، ولكن اخرج من الحلقة عندما i == 3
:
let text = "";
for (let i = 0; i < 5; i++) {
if (i == 3) break;
text += i + "<br>";
}
احذف المعلمة الثانية.
استخدمه break
للخروج من الحلقة ، وإلا فلن تنتهي الحلقة أبدًا ، وسيتعطل متصفحك:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let text = "";
for (let i = 0; ; i++) {
if (i == cars-length) break;
text += cars[i] + "<br>";
}
حلقة فوق مصفوفة بترتيب تنازلي (زيادة سالبة):
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let text = "";
for (let i = cars.length - 1; i >= 0; i--) {
text += cars[i] + "<br>";
}
احذف المعلمة الأخيرة ، وقم بزيادة القيم داخل الحلقة:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let len = cars.length;
for (; i < len;) {
text += cars[i] + "<br>";
i++;
}
قم بتكرار NodeList وقم بتغيير لون جميع عناصر p في القائمة:
const myNodelist = document.getElementsByTagName("P");
for (let i = 0; i < myNodelist.length; i++) {
myNodelist[i].style.color = "blue";
}
حلقة متداخلة (حلقة داخل حلقة):
let text = "";
for (let = 0; i < 3; i++) {
text += i + "<br>";
for (let j = 10; j < 15; j++) {
text += j + "<br>";
}
}
دعم المتصفح
for
هي إحدى ميزات ECMAScript1 (ES1).
ES1 (JavaScript 1997) مدعوم بالكامل في جميع المتصفحات:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | Yes | Yes | Yes | Yes | Yes |