---
id: 5a2efd662fb457916e1fe604
title: do...while 循環
challengeType: 1
videoUrl: 'https://scrimba.com/c/cDqWGcp'
forumTopicId: 301172
dashedName: iterate-with-javascript-do---while-loops
---

# --description--

下一種循環叫作 `do...while` 循環。 它被稱爲 `do...while` 循環，是因爲不論什麼情況，它都會首先 `do`（運行）循環裏的第一部分代碼，然後 `while`（當）規定的條件被評估爲 `true`（真）的時候，它會繼續運行循環。

```js
const ourArray = [];
let i = 0;

do {
  ourArray.push(i);
  i++;
} while (i < 5);
```

上面的示例行爲類似於其他類型的循環，由此產生的數組將看起來像 `[0, 1, 2, 3, 4]`。 然而，`do...while` 不同於其他循環的地方，是第一次循環檢查失敗時的行爲。 讓我們看看代碼中的區別：這裏是一個常規的 `while` 循環，只要 `i < 5`，就會在循環中運行代碼：

```js
const ourArray = []; 
let i = 5;

while (i < 5) {
  ourArray.push(i);
  i++;
}
```

這個例子中，定義了一個空數組 `ourArray` 以及一個值爲 5 的 `i` 。 當執行 `while` 循環時，因爲 `i` 不小於 5，所以循環條件爲 `false`，循環內的代碼將不會執行。 `ourArray` 最終沒有添加任何內容，因此示例中的所有代碼執行完時，ourArray 仍然是`[]`。 現在，看一下 `do...while` 循環。

```js
const ourArray = []; 
let i = 5;

do {
  ourArray.push(i);
  i++;
} while (i < 5);
```

在這裏，和使用 `while` 循環一樣，將 `i` 的值初始化爲 5。 執行下一行時，沒有執行循環檢查，直接執行花括號內的代碼。 數組會添加一個元素，並在進行條件檢查之前遞增 `i`。 然後，在條件檢查時因爲 `i` 等於 6 不符合條件 `i < 5`，所以退出循環。 最終 `ourArray` 的值是 `[5]`。 本質上，`do...while` 循環確保循環內的代碼至少運行一次。 讓我們通過 `do...while` 循環將值添加到數組中。

# --instructions--

將代碼中的 `while` 循環更改爲 `do...while` 循環，將數字 `10` 添加到 `myArray` 中，代碼執行完時，`i` 等於 `11`。

# --hints--

你應該使用 `do...while` 循環。

```js
assert(code.match(/do/g));
```

`myArray` 應該等於 `[10]`。

```js
assert.deepEqual(myArray, [10]);
```

`i` 應該等於 `11`。

```js
assert.equal(i, 11);
```

# --seed--

## --after-user-code--

```js
if(typeof myArray !== "undefined"){(function(){return myArray;})();}
```

## --seed-contents--

```js
// Setup
const myArray = [];
let i = 10;

// Only change code below this line
while (i < 5) {
  myArray.push(i);
  i++;
}
```

# --solutions--

```js
const myArray = [];
let i = 10;
do {
  myArray.push(i);
  i++;
} while (i < 5)
```