diff --git a/1-js/02-first-steps/12-nullish-coalescing-operator/article.md b/1-js/02-first-steps/12-nullish-coalescing-operator/article.md index 7392b81f8..eaf976c97 100644 --- a/1-js/02-first-steps/12-nullish-coalescing-operator/article.md +++ b/1-js/02-first-steps/12-nullish-coalescing-operator/article.md @@ -1,24 +1,24 @@ -# Nullish coalescing operator '??' +# Nullish Coalescing Operator '??' [recent browser="new"] -The nullish coalescing operator `??` provides a short syntax for selecting a first "defined" variable from the list. + Nullish Coalescing Operator `??` يقدم طريقة مختصرة لإختيار أول قيمة معرفة من قائمة متغيرات. -The result of `a ?? b` is: -- `a` if it's not `null` or `undefined`, -- `b`, otherwise. +نتيجة `a ?? b` تكون: +- `a` إذا لم تكن `null` أو `undefined`, +- `b`, غير ذلك. -So, `x = a ?? b` is a short equivalent to: +لذلك فإن `x = a ?? b` طريقة مختصرة للتالي: ```js x = (a !== null && a !== undefined) ? a : b; ``` -Here's a longer example. +هذا مثال أطول. -Let's say, we have a `firstName`, `lastName` or `nickName`, all of them optional. +لنفترض أن لدينا `firstName`, `lastName` أو `nickName` وجميعهم اختياريين. -Let's choose the defined one and show it (or "Anonymous" if nothing is set): +لنختار القيمة المعرفة ونعرضها (أو نعرض "Anonymous" إذا لم يحدد أي شئ): ```js run let firstName = null; @@ -29,25 +29,25 @@ let nickName = "Supercoder"; alert(firstName ?? lastName ?? nickName ?? "Anonymous"); // Supercoder ``` -## Comparison with || +## المقارنة مع || -That's very similar to OR `||` operator. Actually, we can replace `??` with `||` in the code above and get the same result. +هذا مشابه جدًا للمعامل `||`. في الحقيقة يمكننا استبدال `??` ب `||` في المثال السابق وسنحصل على نفس النتيجة. -The important difference is that: -- `||` returns the first *truthy* value. -- `??` returns the first *defined* value. +الفرق الجوهري بينهما أن: +- `||` يرجع أول قيمة *truthy*. +- `??` يرجع أول قيمة *defined*. -This matters a lot when we'd like to treat `null/undefined` differently from `0`. +هذا مهم جدًا عندما نريد معاملة `null/undefined` بطريقة مختلفة عن `0`. -For example: +مثلًا: ```js height = height ?? 100; ``` -This sets `height` to `100` if it's not defined. But if `height` is `0`, then it remains "as is". +هذا يجعل `height` يساوي `100` إذا لم يعرف. ولكن إذا كان `height` يساوي `0` سيبقى كما هو. -Let's compare it with `||`: +لنقارنه مع `||`: ```js run let height = 0; @@ -56,62 +56,62 @@ alert(height || 100); // 100 alert(height ?? 100); // 0 ``` -Here, `height || 100` treats zero height as unset, same as `null`, `undefined` or any other falsy value, depeding on use cases that may be incorrect. +هنا `height || 100` تعامل الصفر مثل `null`, `undefined` أو أي قيمة falsy أخرىوهذا قد لا يكون صحيح أحيانًا. -The `height ?? 100` returns `100` only if `height` is exactly `null` or `undefined`. +ولكن `height ?? 100` ترجع `100` إذا كان فقط `height` يساوي تمامًا `null` أو `undefined`. -## Precedence +## الأولوية -The precedence of the `??` operator is rather low: `7` in the [MDN table](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table). +أولوية المعامل `??` هي قليلة: `7` وتساوي [MDN جدول](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence#Table). -That's lower than most operators and a bit higher than `=` and `?`. +هذا أقل من معظم المعاملات وأكبر بقليل من `=` و `?`. -So if we need to use `??` in a complex expression, then consider adding parentheses: +لذلك إذا أردنا استخدام `??` في تعبيرات معقدة نقوم بإضافة أقواس: ```js run let height = null; let width = null; -// important: use parentheses +// مهم: استخدم الأقواس let area = (height ?? 100) * (width ?? 50); alert(area); // 5000 ``` -Otherwise, if we omit parentheses, then `*` has the higher precedence and would run first. That would be the same as: +إذا لم نستخدم الأقواس فإن `*` له أولوية أعلى وسينفذ أولًا كأننا كتبنا: ```js -// not correct +// غير صحيح let area = height ?? (100 * width) ?? 50; ``` -There's also a related language-level limitation. Due to safety reasons, it's forbidden to use `??` together with `&&` and `||` operators. +هناك أيضًا قيود لغوية. لأسباب أمنية لا يمكن استخدام `??` مع `&&` أو `||`. -The code below triggers a syntax error: +هذا سينتج خطأ لغوي: ```js run let x = 1 && 2 ?? 3; // Syntax error ``` -The limitation is surely debatable, but for some reason it was added to the language specification. +هذا القيد قد لا يبدو منطقيًا ولكن لبعض الأسباب تم إضافته للغة. -Use explicit parentheses to fix it: +استخدم الأقواس لتجنب الخطأ: ```js run -let x = (1 && 2) ?? 3; // Works +let x = (1 && 2) ?? 3; // تعمل دون مشاكل alert(x); // 2 ``` -## Summary +## ملخص -- The nullish coalescing operator `??` provides a short way to choose a "defined" value from the list. +- معامل حذف null `??` يقدم طريقة مختصرة لإختيار أول قيمة معرفة من قائمة قيم. - It's used to assign default values to variables: + يستخدم لوضع قيم افتراضية للمتغيرات: ```js - // set height=100, if height is null or undefined + // اجعل height=100 إذا كان null أو undefined height = height ?? 100; ``` -- The operator `??` has a very low precedence, a bit higher than `?` and `=`. -- It's forbidden to use it with `||` or `&&` without explicit parentheses. +- المعامل `??` لديه أولوية قليلة جدًا لكن أعلة قليلًا من `?` و `=`. +- يمنع استخدامه مع `||` أو `&&` بدون أقواس. diff --git a/1-js/02-first-steps/13-while-for/1-loop-last-value/solution.md b/1-js/02-first-steps/13-while-for/1-loop-last-value/solution.md index 43ee4aad3..5e908f1be 100644 --- a/1-js/02-first-steps/13-while-for/1-loop-last-value/solution.md +++ b/1-js/02-first-steps/13-while-for/1-loop-last-value/solution.md @@ -1,4 +1,4 @@ -The answer: `1`. +الإجابة: `1`. ```js run let i = 3; @@ -8,18 +8,18 @@ while (i) { } ``` -Every loop iteration decreases `i` by `1`. The check `while(i)` stops the loop when `i = 0`. +كل تكرار يقوم بتقليل قيمة `i` بمقدار `1`. وتقوم `while(i)` بإيقاف الحلقة عندما `i = 0`. -Hence, the steps of the loop form the following sequence ("loop unrolled"): +وهكذا تكون الخطوات كالتالي: ```js let i = 3; -alert(i--); // shows 3, decreases i to 2 +alert(i--); // عرض 3, تقليل i إلى 2 -alert(i--) // shows 2, decreases i to 1 +alert(i--) // عرض 2, تقليل i إلى 1 -alert(i--) // shows 1, decreases i to 0 +alert(i--) // عرض 1, تقليل i إلى 0 -// done, while(i) check stops the loop +// تم, while(i) تتوقف الحلقة ``` diff --git a/1-js/02-first-steps/13-while-for/1-loop-last-value/task.md b/1-js/02-first-steps/13-while-for/1-loop-last-value/task.md index 3b847dfa2..05ce3b3a0 100644 --- a/1-js/02-first-steps/13-while-for/1-loop-last-value/task.md +++ b/1-js/02-first-steps/13-while-for/1-loop-last-value/task.md @@ -1,10 +1,10 @@ -importance: 3 +الأهمية: 3 --- -# Last loop value +# آخر قيمة للحلقة -What is the last value alerted by this code? Why? +ما هي آخر قيمة سيتم عرضها ؟ ولماذا ؟ ```js let i = 3; diff --git a/1-js/02-first-steps/13-while-for/2-which-value-while/solution.md b/1-js/02-first-steps/13-while-for/2-which-value-while/solution.md index 495359876..43f6a351e 100644 --- a/1-js/02-first-steps/13-while-for/2-which-value-while/solution.md +++ b/1-js/02-first-steps/13-while-for/2-which-value-while/solution.md @@ -1,30 +1,30 @@ -The task demonstrates how postfix/prefix forms can lead to different results when used in comparisons. +السؤال يوضح كيف يمكن للصيغ postfix/prefix أن تؤدي إلى نتائج مختلفة عندما تستخدم للمقارنة. -1. **From 1 to 4** +1. **من 1 إلى 4** ```js run let i = 0; while (++i < 5) alert( i ); ``` - The first value is `i = 1`, because `++i` first increments `i` and then returns the new value. So the first comparison is `1 < 5` and the `alert` shows `1`. + أول قيمة هي `i = 1` لأن `++i` أولًا تزيد `i` ثم تقوم بإرجاع القيمة الجديدة. لذلك فإن أول عملية مقارنة هي `1 < 5` ويقوم `alert` بعرض `1`. - Then follow `2, 3, 4…` -- the values show up one after another. The comparison always uses the incremented value, because `++` is before the variable. + ثم يتبع ب `2, 3, 4…` -- واحدًا بعد الآخر. المقارنة دائما تستخدم القيمة بعد الزيادة لأن `++` قبل المتغير. - Finally, `i = 4` is incremented to `5`, the comparison `while(5 < 5)` fails, and the loop stops. So `5` is not shown. -2. **From 1 to 5** + أخيرًا `i = 4`تزيد إلى `5` والمقارنة `while(5 < 5)` تفشل وتتوقف الحلقة. لذلك لا يتم عرض `5` . +2. **من 1 إلى 5** ```js run let i = 0; while (i++ < 5) alert( i ); ``` - The first value is again `i = 1`. The postfix form of `i++` increments `i` and then returns the *old* value, so the comparison `i++ < 5` will use `i = 0` (contrary to `++i < 5`). + أول قيمة هي `i = 1`. صيغة postfix `i++` تزيد `i` وترجع القيمة القديمة ولذلك تكون المقارنة `i++ < 5` تستخدم `i = 0` (على العكس من `++i < 5`). - But the `alert` call is separate. It's another statement which executes after the increment and the comparison. So it gets the current `i = 1`. + ولكن استدعاء `alert` منفصل. فهو ينفذ بعد الزيادة والمقارنة. لذلك يحصل على القيمة الحالية `i = 1`. - Then follow `2, 3, 4…` + ثم يتبعه `2, 3, 4…` - Let's stop on `i = 4`. The prefix form `++i` would increment it and use `5` in the comparison. But here we have the postfix form `i++`. So it increments `i` to `5`, but returns the old value. Hence the comparison is actually `while(4 < 5)` -- true, and the control goes on to `alert`. + لنتوقف عند `i = 4`. صيغة prefix `++i` تزيدها وتستخدم `5` في المقارنة. لكن postfix `i++` تزيد `i` إلى `5`وترجع القيمة القديمة. فتكون المقارنة `while(4 < 5)` -- true وينفذ `alert`. - The value `i = 5` is the last one, because on the next step `while(5 < 5)` is false. + قيمة `i = 5` هي آخر قيمة لأن في الخطوة التالية `while(5 < 5)` تكون false. diff --git a/1-js/02-first-steps/13-while-for/2-which-value-while/task.md b/1-js/02-first-steps/13-while-for/2-which-value-while/task.md index 298213237..e1a917cb9 100644 --- a/1-js/02-first-steps/13-while-for/2-which-value-while/task.md +++ b/1-js/02-first-steps/13-while-for/2-which-value-while/task.md @@ -1,20 +1,20 @@ -importance: 4 +الأهمية: 4 --- -# Which values does the while loop show? +# ما القيم التي ستعرضها الحلقة ؟ -For every loop iteration, write down which value it outputs and then compare it with the solution. +في كل تكرار قم بكتابة القيمة التي سيتم عرضها وقارن إجابتك مع الحل. -Both loops `alert` the same values, or not? +هل تقوم كلتا الحلقتين بعرض نفس القيم أم لا ؟ -1. The prefix form `++i`: +1. صيغة prefix `++i`: ```js let i = 0; while (++i < 5) alert( i ); ``` -2. The postfix form `i++` +2. صيغة postfix `i++` ```js let i = 0; diff --git a/1-js/02-first-steps/13-while-for/3-which-value-for/solution.md b/1-js/02-first-steps/13-while-for/3-which-value-for/solution.md index e2e28e75b..e0e1fb210 100644 --- a/1-js/02-first-steps/13-while-for/3-which-value-for/solution.md +++ b/1-js/02-first-steps/13-while-for/3-which-value-for/solution.md @@ -1,4 +1,4 @@ -**The answer: from `0` to `4` in both cases.** +**الإجابة: من `0` إلى `4` في كلتا الحالتين.** ```js run for (let i = 0; i < 5; ++i) alert( i ); @@ -6,12 +6,12 @@ for (let i = 0; i < 5; ++i) alert( i ); for (let i = 0; i < 5; i++) alert( i ); ``` -That can be easily deducted from the algorithm of `for`: +يمكن إيجاد الحل بسهولة من خوارزمية `for`: -1. Execute once `i = 0` before everything (begin). -2. Check the condition `i < 5` -3. If `true` -- execute the loop body `alert(i)`, and then `i++` +1. تنفذ لمرة واحدة `i = 0` قبل أي شئ (begin). +2. تفحص الشرط `i < 5` +3. لو `true` -- تنفذل الأمر `alert(i)` ثم `i++` -The increment `i++` is separated from the condition check (2). That's just another statement. +الزيادة `i++` منفصلة عن فحص الشرط (2). هي فقط أمر آخر. -The value returned by the increment is not used here, so there's no difference between `i++` and `++i`. +لا يتم استخدام القيمة الراجعة من عملية الزيادة لذلك لا فرق بين `i++` و `++i`. diff --git a/1-js/02-first-steps/13-while-for/3-which-value-for/task.md b/1-js/02-first-steps/13-while-for/3-which-value-for/task.md index bfefa63f5..7a06dc9fb 100644 --- a/1-js/02-first-steps/13-while-for/3-which-value-for/task.md +++ b/1-js/02-first-steps/13-while-for/3-which-value-for/task.md @@ -1,19 +1,19 @@ -importance: 4 +الأهمية: 4 --- -# Which values get shown by the "for" loop? +# ما القيم التي ستعرض بواسطة الحلقة "for"? -For each loop write down which values it is going to show. Then compare with the answer. +قم بكتابة القيمة التي ستعرض في كل كل حلقة وقارنها بالحل. -Both loops `alert` same values or not? +هل ستقوم كلتا الحلقتين بعرض نفس القيم أم لا ؟ -1. The postfix form: +1. صيغة postfix: ```js for (let i = 0; i < 5; i++) alert( i ); ``` -2. The prefix form: +2. صيغة prefix: ```js for (let i = 0; i < 5; ++i) alert( i ); diff --git a/1-js/02-first-steps/13-while-for/4-for-even/solution.md b/1-js/02-first-steps/13-while-for/4-for-even/solution.md index e8e66bb47..bef5d9bac 100644 --- a/1-js/02-first-steps/13-while-for/4-for-even/solution.md +++ b/1-js/02-first-steps/13-while-for/4-for-even/solution.md @@ -8,4 +8,4 @@ for (let i = 2; i <= 10; i++) { } ``` -We use the "modulo" operator `%` to get the remainder and check for the evenness here. +نستخدم معامل باقي القسمة `%` لإيجاد باقي القسمة وفحص إذا كان الرقم زوجي. diff --git a/1-js/02-first-steps/13-while-for/4-for-even/task.md b/1-js/02-first-steps/13-while-for/4-for-even/task.md index ff34e7e40..657c36bc3 100644 --- a/1-js/02-first-steps/13-while-for/4-for-even/task.md +++ b/1-js/02-first-steps/13-while-for/4-for-even/task.md @@ -1,9 +1,9 @@ -importance: 5 +الأهمية: 5 --- -# Output even numbers in the loop +# قم بعرض الأرقام الزوجية داخل حلقة تكرارية -Use the `for` loop to output even numbers from `2` to `10`. +استخدم حلقة `for` لعرض الأرقام الزوجية من `2` إلى `10`. [demo] diff --git a/1-js/02-first-steps/13-while-for/5-replace-for-while/task.md b/1-js/02-first-steps/13-while-for/5-replace-for-while/task.md index 0c69d9c2d..7993b2c62 100644 --- a/1-js/02-first-steps/13-while-for/5-replace-for-while/task.md +++ b/1-js/02-first-steps/13-while-for/5-replace-for-while/task.md @@ -1,10 +1,10 @@ -importance: 5 +الأهمية: 5 --- -# Replace "for" with "while" +# استبدل "for" ب "while" -Rewrite the code changing the `for` loop to `while` without altering its behavior (the output should stay same). +اعد كتابة الكود التالي وقم بتبديل حلقة `for` بحلقة `while` دون تغيير الخرج. ```js run for (let i = 0; i < 3; i++) { diff --git a/1-js/02-first-steps/13-while-for/6-repeat-until-correct/solution.md b/1-js/02-first-steps/13-while-for/6-repeat-until-correct/solution.md index 2e04a78c4..ff2432c3d 100644 --- a/1-js/02-first-steps/13-while-for/6-repeat-until-correct/solution.md +++ b/1-js/02-first-steps/13-while-for/6-repeat-until-correct/solution.md @@ -3,13 +3,13 @@ let num; do { - num = prompt("Enter a number greater than 100?", 0); + num = prompt("ادخل رقم أكبر من 100?", 0); } while (num <= 100 && num); ``` -The loop `do..while` repeats while both checks are truthy: +حلقة `do..while` تكرر طالما الشرطين محققين: -1. The check for `num <= 100` -- that is, the entered value is still not greater than `100`. -2. The check `&& num` is false when `num` is `null` or a empty string. Then the `while` loop stops too. +1. شرط `num <= 100` -- أن القيمة لا تزال أقل من أو تساوي `100`. +2. والشرط `&& num` يكون false عندما `num` تكون `null` أو نص فارغ. وهنا تتوقف حلقة `while`. -P.S. If `num` is `null` then `num <= 100` is `true`, so without the 2nd check the loop wouldn't stop if the user clicks CANCEL. Both checks are required. +لاحظ أن إذا كان `num` يساوي `null` يكون الشرط `num <= 100` يساوي `true` لذلك لن تتوقف عملية الإدخال إذا قام المستخدم بإلغائها فكلا الشرطين مطلوب. diff --git a/1-js/02-first-steps/13-while-for/6-repeat-until-correct/task.md b/1-js/02-first-steps/13-while-for/6-repeat-until-correct/task.md index 0788ee76e..944f4802e 100644 --- a/1-js/02-first-steps/13-while-for/6-repeat-until-correct/task.md +++ b/1-js/02-first-steps/13-while-for/6-repeat-until-correct/task.md @@ -1,13 +1,13 @@ -importance: 5 +الأهمية: 5 --- -# Repeat until the input is correct +# تكرار حتى الإدخال الصحيح -Write a loop which prompts for a number greater than `100`. If the visitor enters another number -- ask them to input again. +أكتب حلقة تطلب رقم أكبر من `100`. إذا قام المستخدم بإدخال رقم آخر اسأله مرة أخرى. -The loop must ask for a number until either the visitor enters a number greater than `100` or cancels the input/enters an empty line. +يجب أن تظل تسأل المستخدم حتى يدخل رقم أكبر من `100` أو يوقف الإدخال أو يدخل نص فارغ. -Here we can assume that the visitor only inputs numbers. There's no need to implement a special handling for a non-numeric input in this task. +هنا نفترض أن المستخدم يدخل فقط أرقام فلا داعي للتأكد من القيم الغير رقمية. [demo] diff --git a/1-js/02-first-steps/13-while-for/7-list-primes/solution.md b/1-js/02-first-steps/13-while-for/7-list-primes/solution.md index b4b64b6fa..080453047 100644 --- a/1-js/02-first-steps/13-while-for/7-list-primes/solution.md +++ b/1-js/02-first-steps/13-while-for/7-list-primes/solution.md @@ -1,6 +1,6 @@ -There are many algorithms for this task. +يوجد العديد من الخوارزميات لهذا السؤال. -Let's use a nested loop: +دعنا نستخدم حلقات متداخلة: ```js For each i in the interval { @@ -10,7 +10,7 @@ For each i in the interval { } ``` -The code using a label: +الكود باستخدام عناوين: ```js run let n = 10; @@ -26,4 +26,4 @@ for (let i = 2; i <= n; i++) { // for each i... } ``` -There's a lot of space to optimize it. For instance, we could look for the divisors from `2` to square root of `i`. But anyway, if we want to be really efficient for large intervals, we need to change the approach and rely on advanced maths and complex algorithms like [Quadratic sieve](https://en.wikipedia.org/wiki/Quadratic_sieve), [General number field sieve](https://en.wikipedia.org/wiki/General_number_field_sieve) etc. +يوجد العديد من الطرق لجلعه أفضل. مثلا يمكننا البحث عن القيم التي تقبل القسمة من `2` حتى الجذر التربيعي ل `i`. ولكن إذا أردنا أن نكون أفضل مع الأرقام الكبيرة يجب استخدام بعض الرياضيات المعقدة وخوارزميات مثل [Quadratic sieve](https://en.wikipedia.org/wiki/Quadratic_sieve), [General number field sieve](https://en.wikipedia.org/wiki/General_number_field_sieve) etc. diff --git a/1-js/02-first-steps/13-while-for/7-list-primes/task.md b/1-js/02-first-steps/13-while-for/7-list-primes/task.md index 6344b9f6f..ed213ef52 100644 --- a/1-js/02-first-steps/13-while-for/7-list-primes/task.md +++ b/1-js/02-first-steps/13-while-for/7-list-primes/task.md @@ -1,17 +1,15 @@ -importance: 3 +الأهمية: 3 --- -# Output prime numbers +# اعرض الأرقام الأولية -An integer number greater than `1` is called a [prime](https://en.wikipedia.org/wiki/Prime_number) if it cannot be divided without a remainder by anything except `1` and itself. +أي رقم صحيح أكبر من `1` يسمى [رقم أولي](https://en.wikipedia.org/wiki/Prime_number) إذا كان لا يقبل القسمة إلا على `1` ونفسه فقط. -In other words, `n > 1` is a prime if it can't be evenly divided by anything except `1` and `n`. +مثلًا الرقم `5` هو رقم أولي لأنه لا يقبل القسمة على `2`, `3` و `4`. -For example, `5` is a prime, because it cannot be divided without a remainder by `2`, `3` and `4`. +**اكتب برنامج يعرض الأرقام الأولية بين `2` و `n`.** -**Write the code which outputs prime numbers in the interval from `2` to `n`.** +إذا كانت `n = 10` يكون الناتج `2,3,5,7`. -For `n = 10` the result will be `2,3,5,7`. - -P.S. The code should work for any `n`, not be hard-tuned for any fixed value. +يجب أن يعمل البرنامج مع أي قيمة ل `n` وليس قيمة ثابتة. diff --git a/1-js/02-first-steps/13-while-for/article.md b/1-js/02-first-steps/13-while-for/article.md index b3e3953b8..c6f76e9bf 100644 --- a/1-js/02-first-steps/13-while-for/article.md +++ b/1-js/02-first-steps/13-while-for/article.md @@ -1,14 +1,14 @@ -# Loops: while and for +# الحلقات التكرارية: while و for -We often need to repeat actions. +أحيانًا نحتاج لتكرار مجموعة من الأوامر. -For example, outputting goods from a list one after another or just running the same code for each number from 1 to 10. +مثل عرض منتجات من قائمة واحدًا تلو الآخر أو تكرار نفس الأمر عشر مرات. -*Loops* are a way to repeat the same code multiple times. +*الحلقات التكرارية* هي طريقة لتكرار الأوامر. -## The "while" loop +## حلقة "while" -The `while` loop has the following syntax: +إن حلقة `while` تكتب بالطريقة التالية: ```js while (condition) { @@ -17,38 +17,38 @@ while (condition) { } ``` -While the `condition` is truthy, the `code` from the loop body is executed. +طالما `condition` محقق يتم تنفيذ الكود المكتوب بداخلها. -For instance, the loop below outputs `i` while `i < 3`: +على سبيل المثال فإن الكود التالي يعرضقيمة `i` طالما `i < 3`: ```js run let i = 0; -while (i < 3) { // shows 0, then 1, then 2 +while (i < 3) { // يعرض 0 ثم 1 ثم 2 alert( i ); i++; } ``` -A single execution of the loop body is called *an iteration*. The loop in the example above makes three iterations. +تنفيذ الأوامر لمرة واحدة *تكرار*. المثال السابق يقوم بثلاثة عمليات تكرار. -If `i++` was missing from the example above, the loop would repeat (in theory) forever. In practice, the browser provides ways to stop such loops, and in server-side JavaScript, we can kill the process. +إذا حذفت `i++` سيتم تنفيذ الأوامر (نظريًا) إلى الأبد. ولكن في الحقيقة يقوم المتصفح بمنع حدوث هذا وعند استخدام الجافاسكربت في جانب Server يمكننا لإنهاء العملية. -Any expression or variable can be a loop condition, not just comparisons: the condition is evaluated and converted to a boolean by `while`. +يمكن لأي تعبير أن يكون شرط للتكرار وليس فقط عمليات المقارنة. يتم تنفيذ العملية وتحويل الناتج إلى قيمة منطقية بواسطة `while`. -For instance, a shorter way to write `while (i != 0)` is `while (i)`: +على سبيل المثال يمكن اختصار `while (i != 0)` إلى `while (i)`: ```js run let i = 3; *!* -while (i) { // when i becomes 0, the condition becomes falsy, and the loop stops +while (i) { // عندما i تصبح 0, يصبح الشرط falsy وتتوقف الحلقة */!* alert( i ); i--; } ``` -````smart header="Curly braces are not required for a single-line body" -If the loop body has a single statement, we can omit the curly braces `{…}`: +````smart header="الأقواس المعقوفة غير ضرورية عند تنفيذ أمر واحد" +إذا أردنا تنفيذ أمر واحد فقط فيمكن تجاهل الأقواس المعقوفة `{…}`: ```js run let i = 3; @@ -58,9 +58,9 @@ while (i) alert(i--); ``` ```` -## The "do..while" loop +## حلقة "do..while" -The condition check can be moved *below* the loop body using the `do..while` syntax: +يمكن نقل الشرط إلى بعد الأوامر باستخدام نمط `do..while`: ```js do { @@ -68,9 +68,9 @@ do { } while (condition); ``` -The loop will first execute the body, then check the condition, and, while it's truthy, execute it again and again. +سيتم أولا تنفيذ الأوامر ثم اختبار الشرط وإذا تحقق سيتم تنفيذ الأوامر مرة أخرى. -For example: +على سبيل المثال: ```js run let i = 0; @@ -80,13 +80,13 @@ do { } while (i < 3); ``` -This form of syntax should only be used when you want the body of the loop to execute **at least once** regardless of the condition being truthy. Usually, the other form is preferred: `while(…) {…}`. +هذه الطريقة يجب أن تستخدم فقط إذا أرد للأوامر أن تنفذ **مرة واحدة على الأقل** متجاهلًا الشرط. ففي الغالب يفضل استخدام: `while(…) {…}`. -## The "for" loop +## حلقة "for" -The `for` loop is more complex, but it's also the most commonly used loop. +حلقة `for` معقدة أكثر ولكنها الأكثر استخدامًا في تكرار الأوامر. -It looks like this: +تكتب كالآتي: ```js for (begin; condition; step) { @@ -94,95 +94,95 @@ for (begin; condition; step) { } ``` -Let's learn the meaning of these parts by example. The loop below runs `alert(i)` for `i` from `0` up to (but not including) `3`: +لنتعرف على معاني هذه الأجزاء باستخدام مثال. الحلقة التالية تنفذ الأمر `alert(i)` ابتداءًا من `i` تساوي `0` حتى (لكن لا تشمل) `3`: ```js run -for (let i = 0; i < 3; i++) { // shows 0, then 1, then 2 +for (let i = 0; i < 3; i++) { // تعرض 0 ثم 1 ثم 2 alert(i); } ``` -Let's examine the `for` statement part-by-part: +لنشرح `for` جزء بجزء: -| part | | | +| الجزء | | | |-------|----------|----------------------------------------------------------------------------| -| begin | `i = 0` | Executes once upon entering the loop. | -| condition | `i < 3`| Checked before every loop iteration. If false, the loop stops. | -| body | `alert(i)`| Runs again and again while the condition is truthy. | -| step| `i++` | Executes after the body on each iteration. | +| begin | `i = 0` | ينفذ مرة واحدة فقط في البداية. | +| condition | `i < 3`| يتم اختباره قبل كل عملية تكرار وإذا لم يتحقق يتوقف التكرار. | +| body | `alert(i)`| تنفذ طالما الشرط محقق. | +| step| `i++` | ينفذ بعد body في كل عملية تكرار. | -The general loop algorithm works like this: +الخوارزمية العامة للتكرار تعمل كالتالي: ``` -Run begin -→ (if condition → run body and run step) -→ (if condition → run body and run step) -→ (if condition → run body and run step) +نفذ begin +→ (if condition → نفذ body ثم نفذ step) +→ (if condition → نفذ body ثم نفذ step) +→ (if condition → نفذ body ثم نفذ step) → ... ``` -That is, `begin` executes once, and then it iterates: after each `condition` test, `body` and `step` are executed. +وهكذا يتم تنفيذ `begin` مرة واحدة وبعد ذلك يبدأ التكرار: بعد كل عاختبار للشرط `condition` يتم تنفيذ `body` و `step`. -If you are new to loops, it could help to go back to the example and reproduce how it runs step-by-step on a piece of paper. +إذا كنت جديد على الحلقات التكرارية فيفضل الرجوع للمثال وتنفيذه خطوة بخطوة على ورقة. -Here's exactly what happens in our case: +هذا ما يحدث تمامًا في مثالنا: ```js // for (let i = 0; i < 3; i++) alert(i) -// run begin +// نفذ begin let i = 0 -// if condition → run body and run step +// if condition → نفذ body ثم نفذ step if (i < 3) { alert(i); i++ } -// if condition → run body and run step +// if condition → نفذ body ثم نفذ step if (i < 3) { alert(i); i++ } -// if condition → run body and run step +// if condition → نفذ body ثم نفذ step if (i < 3) { alert(i); i++ } // ...finish, because now i == 3 ``` ````smart header="Inline variable declaration" -Here, the "counter" variable `i` is declared right in the loop. This is called an "inline" variable declaration. Such variables are visible only inside the loop. +هنا تم تعريف العداد `i` داخل الحلقة. وهذا يسمى "inline" variable declaration. وهذه المتغيرات تكون متاحة فقط داخل الحلقة. ```js run for (*!*let*/!* i = 0; i < 3; i++) { alert(i); // 0, 1, 2 } -alert(i); // error, no such variable +alert(i); // خطأ! متغير غير معرف ``` -Instead of defining a variable, we could use an existing one: +بدلًا من تعريف متغير جديد يمكننا استخدام واحد معرف مسبقًا: ```js run let i = 0; -for (i = 0; i < 3; i++) { // use an existing variable +for (i = 0; i < 3; i++) { // استخدام متغير معرف مسبقًا alert(i); // 0, 1, 2 } -alert(i); // 3, visible, because declared outside of the loop +alert(i); // 3, يمكن التعامل معه لأنه معرف خارج الحلقة ``` ```` -### Skipping parts +### أجزاء يمكن تخطيها -Any part of `for` can be skipped. +أي جزء من `for` يمكن الاستغناء عنه. -For example, we can omit `begin` if we don't need to do anything at the loop start. +مثلًا إذا حذفنا `begin` لن يكون لدينا ما نفعله في بداية الحلقة. -Like here: +مثل: ```js run -let i = 0; // we have i already declared and assigned +let i = 0; // تم تعريف وتخصيص قيمة المتغير -for (; i < 3; i++) { // no need for "begin" +for (; i < 3; i++) { // لا نحتاج "begin" alert( i ); // 0, 1, 2 } ``` -We can also remove the `step` part: +يمكن أيضًا حذف جزء `step`: ```js run let i = 0; @@ -192,32 +192,32 @@ for (; i < 3;) { } ``` -This makes the loop identical to `while (i < 3)`. +هذا يجعلها تطابق `while (i < 3)`. -We can actually remove everything, creating an infinite loop: +يمكننا حذف كل شئ وخلق حلقة لا نهائية فارغة: ```js for (;;) { - // repeats without limits + // تتكرر دائمًا } ``` -Please note that the two `for` semicolons `;` must be present. Otherwise, there would be a syntax error. +لاحظ أن كلتا الفاصلتين المنقوطتين `;` داخل `for` يجب أن يوضعا وإلا سيظهر خطأ لغوي. -## Breaking the loop +## إيقاف الحلقة -Normally, a loop exits when its condition becomes falsy. +في العادة تتوقف الحلقة عندما يصبح الشرط غير محقق. -But we can force the exit at any time using the special `break` directive. +ولكن يمكننا اجبارها على التوقف في أي وقت باستخدام كلمة `break`. -For example, the loop below asks the user for a series of numbers, "breaking" when no number is entered: +على سبيل المثال فإن الحلقة التالية تطلب من المستخدم إدخال مجموعة أرقام وتتوقف إذا لم يدخل رقم: ```js run let sum = 0; while (true) { - let value = +prompt("Enter a number", ''); + let value = +prompt("ادخل رقم", ''); *!* if (!value) break; // (*) @@ -226,35 +226,35 @@ while (true) { sum += value; } -alert( 'Sum: ' + sum ); +alert( 'المجموع: ' + sum ); ``` -The `break` directive is activated at the line `(*)` if the user enters an empty line or cancels the input. It stops the loop immediately, passing control to the first line after the loop. Namely, `alert`. +تم تنشيط `break` في السطر `(*)` إذا قام المستخدم بإدخال سطر فارغ أو إيقاف الإدخال. وهذا يوقف الحلقة مباشرة ويذهب إلى السطر المكتوب بعدها والذي هو `alert`. -The combination "infinite loop + `break` as needed" is great for situations when a loop's condition must be checked not in the beginning or end of the loop, but in the middle or even in several places of its body. +دمج "الحلقات اللانهائية + `break`" يستخدم في الحالات التي نريد فيها اختبار الشرط في منتصف التكرار أو في عدة أماكن وليس في بداية التكرار. -## Continue to the next iteration [#continue] +## المتابعة للتكرار التالي [#continue] -The `continue` directive is a "lighter version" of `break`. It doesn't stop the whole loop. Instead, it stops the current iteration and forces the loop to start a new one (if the condition allows). +كلمة `continue` هي نسخة أخف من `break`. هي لا توقف الحلقة كلها ولكنها توقف التكرار الحالي وتبدأ تكرار جديد. -We can use it if we're done with the current iteration and would like to move on to the next one. +يمكننا استخدامها إذا انتهينا من التكرار الحالي ونريد الانتقال إلى تكرار جديد. -The loop below uses `continue` to output only odd values: +الكود التالي يستخدم `continue` لعرض القيم الفردية فقط: ```js run no-beautify for (let i = 0; i < 10; i++) { - // if true, skip the remaining part of the body + // if true, تخطي الجزء الباقي من التكرار *!*if (i % 2 == 0) continue;*/!* alert(i); // 1, then 3, 5, 7, 9 } ``` -For even values of `i`, the `continue` directive stops executing the body and passes control to the next iteration of `for` (with the next number). So the `alert` is only called for odd values. +في القيم الزوجية من `i` تقوم `continue` بإيقاف التكرار الحالى وتنتقل لتكرار جديد من `for` (بالرقم التالي). ولهذا فإن `alert` ينفذ فقط مع القيم الفردية. -````smart header="The `continue` directive helps decrease nesting" -A loop that shows odd values could look like this: +````smart header="تساعد `continue` على تقليل التداخل" +يمكن عرض الأرقام الفردية بالطريقة التالية: ```js run for (let i = 0; i < 10; i++) { @@ -266,15 +266,15 @@ for (let i = 0; i < 10; i++) { } ``` -From a technical point of view, this is identical to the example above. Surely, we can just wrap the code in an `if` block instead of using `continue`. +هذا الكود مطابق تمامًا للسابق. يمكننا فقط وضع الكود داخل `if` بدلًا من استخدام `continue`. -But as a side-effect, this created one more level of nesting (the `alert` call inside the curly braces). If the code inside of `if` is longer than a few lines, that may decrease the overall readability. +ولكن هذا ينتج مستوى آخر من التداخل (استدعاء `alert` داخل أقواس معقوفة). إذا كان ما بداخل `if` سطور كثيرة فهذا سيقلل من إمكانية قراءة الكود بوضوح. ```` -````warn header="No `break/continue` to the right side of '?'" -Please note that syntax constructs that are not expressions cannot be used with the ternary operator `?`. In particular, directives such as `break/continue` aren't allowed there. +````warn header="لا يمكن استخدام `break/continue` في الجانب الأيمن من '?'" +لا يمكن استخدام هذه التعبيرات `break/continue` مع المعامل الشرطي `?`. -For example, if we take this code: +على سبيل المثال إذا أخذنا هذا الكود: ```js if (i > 5) { @@ -284,23 +284,23 @@ if (i > 5) { } ``` -...and rewrite it using a question mark: +...وكتبناه باستخدام علامة الاستفهام: ```js no-beautify -(i > 5) ? alert(i) : *!*continue*/!*; // continue isn't allowed here +(i > 5) ? alert(i) : *!*continue*/!*; // continue لا يسمح باستخدامها هنا ``` -...it stops working: there's a syntax error. +...يتوقف عن العمل مع خطأ لغوي. -This is just another reason not to use the question mark operator `?` instead of `if`. +وهذا سبب آخر لعدم استخدام `?` بدلًا من `if`. ```` -## Labels for break/continue +## عنونة break/continue -Sometimes we need to break out from multiple nested loops at once. +أحيانا نريد الخروج من مجموعة حلقات متداخلة مرة واحدة. -For example, in the code below we loop over `i` and `j`, prompting for the coordinates `(i, j)` from `(0,0)` to `(2,2)`: +في المثال التالي نقوم بالتكرار باستخدام `i` و `j`, ونطلب احداثيات `(i, j)` من `(0,0)` إلى `(2,2)`: ```js run no-beautify for (let i = 0; i < 3; i++) { @@ -309,25 +309,25 @@ for (let i = 0; i < 3; i++) { let input = prompt(`Value at coords (${i},${j})`, ''); - // what if we want to exit from here to Done (below)? + // إذا أردنا الخروج من هنا إلى Done (بالأسفل)? } } alert('Done!'); ``` -We need a way to stop the process if the user cancels the input. +نحتاج إلى طريقة لإيقاف العملية إذا قام المستخدم بإلغاء الإدخال. -The ordinary `break` after `input` would only break the inner loop. That's not sufficient--labels, come to the rescue! +وضع `break` بعد `input` سيوقف فقط الحلقة الداخلية. وهذا غير مجدي--جاءت العنونة لإنقاذ الموقف! -A *label* is an identifier with a colon before a loop: +إن *label* يقوم بتعريف الحلقة باستخدام نقطتين قبلها: ```js labelName: for (...) { ... } ``` -The `break ` statement in the loop below breaks out to the label: +استخدام `break ` في الحلقة سيوقف الحلقة ذات العنوان المحدد: ```js run no-beautify *!*outer:*/!* for (let i = 0; i < 3; i++) { @@ -336,51 +336,51 @@ The `break ` statement in the loop below breaks out to the label: let input = prompt(`Value at coords (${i},${j})`, ''); - // if an empty string or canceled, then break out of both loops + // إذا أدخل نص فارغ أو ألغى الإدخال قم بإيقاف الحلقتين if (!input) *!*break outer*/!*; // (*) - // do something with the value... + // أفعل شئ ما بالقيمة... } } alert('Done!'); ``` -In the code above, `break outer` looks upwards for the label named `outer` and breaks out of that loop. +في الكود السابق تقوم `break outer` بالبحث عن label اسمه `outer` وتوقف هذه الحلقة. -So the control goes straight from `(*)` to `alert('Done!')`. +لذلك ينتقل من `(*)` إلى `alert('Done!')`. -We can also move the label onto a separate line: +يمكن أيضا وضع العنوان في سطر منفصل: ```js no-beautify outer: for (let i = 0; i < 3; i++) { ... } ``` -The `continue` directive can also be used with a label. In this case, code execution jumps to the next iteration of the labeled loop. +يمكن استخدام `continue` أيضًا مع label. وفي هذه الحالة سينتقل للتكرار التالي من الحلقة المحددة. -````warn header="Labels do not allow to \"jump\" anywhere" -Labels do not allow us to jump into an arbitrary place in the code. +````warn header="Labels لا تستخدم للإنتقال إلى أي مكان" +Labels لا تسمح لنا بالإنتقال إلى أي مكان داخل الكود. -For example, it is impossible to do this: +فعلى سبيل المثال لا يمكننا فعل التالي: ```js -break label; // doesn't jumps to the label below +break label; // لن تنتقل إلى label بالأسفل label: for (...) ``` -A call to `break/continue` is only possible from inside a loop and the label must be somewhere above the directive. +استخدام `break/continue` ممكن فقط من داخل الحلقة ويجب أن يكون Label موجود قبلهم. ```` -## Summary +## ملخص -We covered 3 types of loops: +تحدثنا عن 3 أنواع من الحلقات: -- `while` -- The condition is checked before each iteration. -- `do..while` -- The condition is checked after each iteration. -- `for (;;)` -- The condition is checked before each iteration, additional settings available. +- `while` -- يتم فحص الشرط قبل التكرار. +- `do..while` -- يتم فحص الشرط بعد التكرار. +- `for (;;)` -- يتم فحص الشرط قبل التكرار, بعض المتغيرات الأخرى للإعداد. -To make an "infinite" loop, usually the `while(true)` construct is used. Such a loop, just like any other, can be stopped with the `break` directive. +لعمل حلقة لانهائية غالبا يتم استخدام `while(true)`. ويمكن إيقافها مثل أي حلقة أخرى باستخدام `break`. -If we don't want to do anything in the current iteration and would like to forward to the next one, we can use the `continue` directive. +إذا لم نرد فعل أي شئ في التكرار الحالي ونريد الإنتقال إلى التكرار التالي يمكننا استخدام `continue`. -`break/continue` support labels before the loop. A label is the only way for `break/continue` to escape a nested loop to go to an outer one. +`break/continue` تدعم العناوين قبل الحلقة. العنوان هو الطريقة الوحيدة ل `break/continue` للإنتقال بين الحلقات المتداخلة إلى الحلقة الخارجية.