# Javascript.info 2.13 Loops: while and for (9/16)

ref: https://javascript.info/while-for

------

### while

在condition是true的時候 ，loop body才會執行

syntax:

while (condition) {
  // code
  // so-called "loop body"
}

Any expression or variable can be a loop condition, not just comparisons: the condition is **evaluated and converted to a boolean by while.**

For instance, a shorter way to write while (i != 0) is while (i):

let i = 3;
while (i) { // when i becomes 0, the condition becomes falsy, and the loop stops
  alert( i );
  i--;
}

------

### do..while

The condition check can be moved below the loop body using the do..while

syntax:

do {
  // loop body
} while (condition);

The loop will first execute the body, then check the condition, and, while it’s truthy, execute it again and again.

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(…) {…}.

------

### for

The for loop is more complex, but it’s also the most commonly used loop.

syntax:

for (begin; condition; step) {
  // ... loop body ...
}

執行順序：begin > condition > loop body > step

-----

### break

Normally, a loop exits when its condition becomes falsy. But we can force the exit at any time using the special break directive.
=> **jump out** of a loop

let sum = 0;

while (true) {

  let value = +prompt("Enter a number", '');
  
/* "+"是為了轉型，prompt的回傳值的型態是字串，用+轉型成數字
但要注意輸入的值要是數字才有用，亂打就沒用 */

  if (!value) break; // (*)
  
  sum += value;

}

alert( 'Sum: ' + sum );

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.

----

### 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).
=> **jump over** of a loop

* 和break一樣的是，遇到此陳述就會跳出來，但continue會繼續執行

for (let i = 0; i < 10; i++) {

  // if true, skip the remaining part of the body
  if (i % 2 == 0) continue;

  alert(i); // 1, then 3, 5, 7, 9
}

//當condition=true 他會直接執行step
//當condition=false 就會跳出loop 然後執行 alert

---
**break和continue不能和三元運算值一起使用**

* ternary : The operator is represented by a question mark "?". Sometimes it’s called “ternary”, because the operator has three operands. It is actually the one and only operator in JavaScript which has that many.

the syntax :

`let result = condition ? value1 : value2;`

For example :

`let accessAllowed = (age > 18) ? true : false;`

* condition is true 會執行?後的事情
* condition is false 會執行:後的事情

* 三元運算值不能放continue或break


</br>

* Labels for break/continue

* Sometimes we need to break out from multiple nested loops at once.

* The ordinary break after input would only break the inner loop. That’s not sufficient–labels, come to the rescue!

the syntax:

  labelName: for (...) {
  ...
  }

* The break <labelName> statement in the loop below breaks out to the label

outer: for (let i = 0; i < 3; i++) {

  for (let j = 0; j < 3; j++) {

    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!');

* We can also move the label onto a separate line:

outer:
for (let i = 0; i < 3; i++) { ... }

-----

### summary


###### tags: `Javascript`
{%hackmd BJrTq20hE %}