شرح حلقات جافا سكريبت: للحلقة ، وأثناء التكرار ، والقيام ... أثناء التكرار ، والمزيد

تُستخدم الحلقات في JavaScript لأداء مهام متكررة بناءً على شرط. تعود الشروط عادة trueأو falseعند تحليلها. ستستمر الحلقة في العمل حتى يعود الشرط المحدد false.

الأنواع الثلاثة الأكثر شيوعًا من الحلقات هي

  • إلى عن على
  • في حين
  • افعل اثناء

يمكنك الكتابة js for، js whileأو js do whileللحصول على مزيد من المعلومات حول أي منها. دعونا نلقي نظرة عليها ، وبعض الاختلافات ، بمزيد من التفصيل الآن.

لحلقة

بناء الجملة

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

forيتكون بيان جافا سكريبت من ثلاثة تعبيرات وبيان:

وصف

  • التهيئة - قم بالتشغيل قبل التنفيذ الأول في الحلقة. يستخدم هذا التعبير بشكل شائع لإنشاء عدادات. يتم تحديد المتغيرات التي تم إنشاؤها هنا في الحلقة. بمجرد أن تنتهي الحلقة من التنفيذ ، يتم تدميرها.
  • الشرط - التعبير الذي يتم فحصه قبل تنفيذ كل تكرار. إذا تم حذفه ، يتم تقييم هذا التعبير إلى صحيح. إذا كانت النتيجة صحيحة ، فسيتم تنفيذ تعليمة الحلقة. إذا تم التقييم على خطأ ، تتوقف الحلقة.
  • التعبير النهائي - التعبير الذي يتم تشغيله بعد كل تكرار. تستخدم عادة لزيادة العداد. ولكن يمكن استخدامه لتقليل العداد أيضًا.
  • البيان - رمز يتكرر في الحلقة

يمكن حذف أي من هذه التعبيرات الثلاثة أو البيان. تُستخدم حلقات For بشكل شائع لحساب عدد معين من التكرارات لتكرار عبارة. استخدم breakتعليمة للخروج من الحلقة قبل تقييم تعبير الشرط إلى خطأ.

المخاطر المشتركة

تجاوز حدود المصفوفة

عند الفهرسة على مصفوفة عدة مرات ، يكون من السهل تجاوز حدود المصفوفة (على سبيل المثال ، حاول الإشارة إلى العنصر الرابع من مصفوفة مكونة من 3 عناصر).

 // This will cause an error. // The bounds of the array will be exceeded. var arr = [ 1, 2, 3 ]; for (var i = 0; i <= arr.length; i++) { console.log(arr[i]); } output: 1 2 3 undefined

هناك طريقتان لإصلاح هذا الرمز. اضبط الشرط على إما i < arr.lengthأوi <= arr.length - 1

أمثلة

كرر من خلال الأعداد الصحيحة من 0-8

for (var i = 0; i < 9; i++) { console.log(i); } output: 0 1 2 3 4 5 6 7 8

الخروج من حلقة قبل أن يكون تعبير الشرط خاطئًا

for (var elephant = 1; elephant < 10; elephant+=2) { if (elephant === 7) { break; } console.info('elephant is ' + elephant); } output: elephant is 1 elephant is 3 elephant is 5

لـ ... في الحلقة

في for...inبيان بالتكرار على خصائص enumerable ل كائن، من أجل التعسفي. لكل خاصية مميزة ، يمكن تنفيذ البيانات.

for (variable in object) { ... }

Required / OptionalParameterDescriptionRequiredVariable يتم تعيين اسم خاصية مختلف إلى متغير في كل تكرار .OptionalObjectObject يتم تكرار خصائصه القابلة للتعداد.

أمثلة

// Initialize object. a = { "a": "Athens", "b": "Belgrade", "c": "Cairo" } // Iterate over the properties. var s = "" for (var key in a) { s += key + ": " + a[key]; s += "

"; } document.write (s); // Output: // a: Athens // b: Belgrade // c: Cairo // Initialize the array. var arr = new Array("zero", "one", "two"); // Add a few expando properties to the array. arr["orange"] = "fruit"; arr["carrot"] = "vegetable"; // Iterate over the properties and elements. var s = ""; for (var key in arr) { s += key + ": " + arr[key]; s += "

"; } document.write (s); // Output: // 0: zero // 1: one // 2: two // orange: fruit // carrot: vegetable // Efficient way of getting an object's keys using an expression within the for-in loop's conditions var myObj = {a: 1, b: 2, c:3}, myKeys = [], i=0; for (myKeys[i++] in myObj); document.write(myKeys); //Output: // a // b // c

من أجل ... من الحلقة

في for...ofبيان يخلق بالتكرار حلقة على الأجسام iterable (بما في ذلك صفيف، خريطة، مجموعة، الكائن الحجج وهلم جرا)، الاحتجاج التكرار ربط مخصصة مع البيانات ليتم تنفيذها لقيمة كل عقار متميزة.

 for (variable of object) { statement }

الوصفالمتغير في كل تكرار يتم تعيين قيمة لخاصية مختلفة إلى المتغير الكائن الذي يتم تكرار خصائصه القابلة للعد.

أمثلة

مجموعة مصفوفة

 let arr = [ "fred", "tom", "bob" ]; for (let i of arr) { console.log(i); } // Output: // fred // tom // bob

خريطة

 var m = new Map(); m.set(1, "black"); m.set(2, "red"); for (var n of m) { console.log(n); } // Output: // 1,black // 2,red

جلس

 var s = new Set(); s.add(1); s.add("red"); for (var n of s) { console.log(n); } // Output: // 1 // red

كائن الحجج

 // your browser must support for..of loop // and let-scoped variables in for loops function displayArgumentsObject() { for (let n of arguments) { console.log(n); } } displayArgumentsObject(1, 'red'); // Output: // 1 // red

حائط اللوب

تبدأ الحلقة while من خلال تقييم الحالة. إذا كان الشرط صحيحًا ، يتم تنفيذ العبارة (العبارات). إذا كان الشرط خاطئًا ، فلن يتم تنفيذ العبارة (العبارات). بعد ذلك ، بينما تنتهي الحلقة.

Here is the syntax for while loop:

Syntax:

while (condition) { statement(s); }

statement(s): A statement that is executed as long as the condition evaluates to true.

condition: Here, condition is a Boolean expression which is evaluated before each pass through the loop. If this condition evaluates to true, statement(s) is/are executed. When condition evaluates to false, execution continues with the statement after the while loop.

Example:

 var i = 1; while (i < 10) { console.log(i); i++; // i=i+1 same thing } Output: 1 2 3 4 5 6 7 8 9

How to Iterate with JavaScript While Loops

While loops will run as long as the condition inside the ( ) is true. Example:

while(condition){ code... }

Hint 1:

Use a iterator variable such as i in your condition

var i = 0; while(i <= 4){ }

Spoiler Alert Solution Ahead!

Solution:

// Setup var myArray = []; // Only change code below this line. var i = 0; while (i <= 4){ myArray.push(i); i++; }

Do...while loop

The do...while loop is closely related to while loop. In the do while loop, the condition is checked at the end of the loop.

Here is the syntax for do...while loop:

Syntax:

 do { *Statement(s);* } while (*condition*);

statement(s): A statement that is executed at least once before the condition or Boolean expression is evaluated and is re-executed each time the condition evaluates to true.

condition: Here, a condition is a Boolean expression. If Boolean expression evaluates to true, the statement is executed again. When Boolean expression evaluates to false, the loops ends.

Example:

var i = 0; do { i = i + 1; console.log(i); } while (i < 5); Output: 1 2 3 4 5

How to Iterate with JavaScript Do…While Loops

  • Do...Whileحلقات يتأكد أن يتم تنفيذ التعليمات البرمجية على الأقل مرة واحدة، وبعد التنفيذ، وإذا كان الشرط داخل while()هي الحقيقية ، فإنه لا يزال مع الحلقة، وإلا فإنه يتوقف.

المحلول:

var myArray = []; var i = 10; do { myArray.push(i); i++; } while(i <= 10);