Lesson 12 / الدرس 12

Repeating: the while loop / التكرار: حلقة while

The third thing a program can do. A while loop is the simplest form and the one that shows the machinery clearly — including the mistake that freezes the browser.

الثالث مما يستطيعه البرنامج. وحلقة while أبسط صيغة وهي التي تُظهر الآلة بوضوح — بما فيه الخطأ الذي يجمّد المتصفح.

let count = 1;                 1. start somewhere
while (count <= 5) {           2. a condition, checked EVERY time round
  console.log(count);
  count = count + 1;           3. something that moves towards the end
}

Every loop has those three parts, in every language. Leave out the third and the condition never becomes false — the loop runs forever and the page stops responding. Run the demonstration.

When while is the right loop

You know	Use
Exactly how many times	for — lesson 13
Only a condition to stop at	while
You must run at least once	do … while
You are going through a list	for … of — lesson 15

The second row is where while earns its place: reading until there is nothing left, retrying until something succeeds, keeping going until a total is reached. You do not know the count in advance, and a for loop would be pretending you did.

والسطر الثاني هو حيث تستحق while مكانها: القراءة حتى لا يبقى شيء، وإعادة المحاولة حتى ينجح شيء، والاستمرار حتى يُبلغ مجموع. فأنت لا تعرف العدد مسبقًا، وحلقة for كانت ستتظاهر بأنك تعرفه.

والحلقة اللانهائية تجمّد اللسان كله لا نصك فحسب — فلا يستطيع المتصفح الرسم ولا الاستجابة لنقرة ولا تشغيل أي شيء آخر وهو يدور. وستضطر إلى إغلاق اللسان، ويذهب معه العمل غير المحفوظ في المحرر بجانب هذه الدروس. وقبل تشغيل أي while، اعثر على السطر الذي يتحرك نحو صيرورة الشرط خطأً وتأكد أنه موجود فعلًا.

Off by one

The commonest loop bug is running one time too many or too few, and it comes down to < against <=. Starting at 1, while (i <= 5) runs five times; while (i < 5) runs four. Starting at 0, it is the other way round. Rather than reasoning about it, run the loop with a small number and count the output — it takes ten seconds and is never wrong.

وأشيع عيب في الحلقات هو التنفيذ مرة أكثر أو أقل، ويعود إلى < في مقابل <=. فبدءًا من 1، تعمل while (i <= 5) خمس مرات؛ وwhile (i < 5) أربعًا. وبدءًا من 0 يكون العكس. وبدل التفكير في ذلك، شغّل الحلقة برقم صغير وعُدّ المخرَج — فذلك يستغرق عشر ثوانٍ ولا يخطئ أبدًا.

Try it live / جرّب بنفسك

<h1>Repeating until something is true</h1>
<pre id="out"></pre>

<script>
  const lines = [];
  let value = 1000;
  let steps = 0;

  while (value >= 1) {
    // your work here
    steps = steps + 1;
    value = value / 2;
  }

  document.getElementById('out').textContent = lines.join('\n');
</script>

Preview / المعاينة

Check yourself / اختبر نفسك

1. What are the three parts every loop needs?

2. When is while a better choice than for?

متى تكون while خيارًا أفضل من for؟

3. What happens when a loop never ends?

Your task / مهمتك

Use a while loop for something whose length you genuinely cannot know in advance: keep halving a number until it drops below one and count the steps, or keep adding items to a basket until a budget is spent. Print each round so the progress is visible. Then write a loop that would run forever, protect it with a guard counter, and explain which of the three parts was missing.

استخدم حلقة while لشيء لا تستطيع معرفة طوله مسبقًا فعلًا: كأن تنصّف رقمًا حتى ينزل تحت الواحد وتعدّ الخطوات، أو تضيف أصنافًا إلى سلة حتى تُنفق ميزانية. واطبع كل دورة ليكون التقدم مرئيًا. ثم اكتب حلقة كانت ستعمل إلى الأبد، واحمها بعدّاد حراسة، واشرح أي الأجزاء الثلاثة كان مفقودًا.

A loop whose count is genuinely unknown in advance حلقة عددها غير معروف مسبقًا فعلًا
Every round printed كل دورة مطبوعة
A runaway loop, made safe with a guard حلقة جامحة مؤمَّنة بحارس
Which of the three parts was missing, named أي الأجزاء الثلاثة كان مفقودًا، مسمّى