最近系統學習了vue.js 的官方腳手架create-vue的源碼，深入分析了裡面的技術實現細節，本文是我整理的源碼學習文章。 ...
迴圈語句在js當中主要用於重覆做一件事情。
js當中最主要的迴圈語句有三種，for迴圈，while迴圈和do-while迴圈
for
for 是一種經常被用到的迴圈結構
例如：控制台迴圈列印1到10 的數字
// for 括弧後跟著 三個表達式， 三個表達式用 分號(;) 隔開
// var i = 0 表示定義一個迴圈遍歷變數， 並賦初值 為 0
// i < 10 表示 一個 布爾表達式， 如果此條件為真，則會一直執行迴圈代碼塊當中的內容
// 表達式 i++ 用來迴圈更新變數，使得變數越來越接近於 布爾表達式當中的10
<script>
for (var i = 0; i < 10; i++) {
// 迴圈代碼塊
console.log(i + 1);
}
</script>
從上面的例子可以看出， var i = 0 ; 只執行一次， 然後再執行 i < 10 ，如果成立 執行 迴圈代碼塊中的內容 ， 最後執行 i++ ; 然後迴圈 從 i < 10 …到 i++ 往複執行
for 語句執行過程
while
while 也是一種迴圈結構，它經常作用於不知道要遍歷多少次，只知道什麼時候結束的場景。
使用while語句需要註意：在迴圈語句體內必須定義一個退出的條件， 否則會造成死迴圈
while 語句執行過程
while 迴圈通常先判斷條件表達式，然後再決定是否執行迴圈語句體中的內容
while(布爾測試條件) {
// 語句體
}
舉例
<script>
// 定義迴圈變數
var i = 1;
// 判斷是有資格進入迴圈條件內容
while (i < 10) {
console.log(i);
// 設置自增， 使得 i 滿足 大於 10 後退出
i++;
}
</script>
do-while
do-while 也是一種迴圈結構， 通常do-while 是 先執行迴圈體然後才判斷條件（這個正好和while相反，while是先判斷條件後執行）， 條件判斷的結果影響是否下一次進入迴圈語句
所以說 do-while會至少執行一次
語法
do {
// 迴圈體
} while(迴圈條件判斷)
舉例
do-while至少執行一次
<script>
do {
console.log("執行");
} while (false);
</script>
do-while 迴圈列印
<script>
var i = 0;
do {
console.log(i);
i++;
} while (i < 10);
</script>
break
break 代表終止迴圈 ，在 for ，while 和 do..while 中都可以使用
舉例：for 迴圈 break
<script>
// 輸出列印到 5 就終止了
for (var i = 0; i < 10; i++) {
console.log(i);
if (i == 5) {
break;
}
}
</script>
while迴圈break
<script>
var i = 0;
while (i < 10) {
console.log(i);
if (i == 5) {
break;
}
i++;
}
</script>
do…while 迴圈 break
<script>
var j = 0;
do {
console.log(j);
j++;
if (j == 6) {
break;
}
} while (j < 10);
</script>
雖然以上三個例子都還沒有到達條件語句結尾， 但是break 就可以提前結束迴圈
continue
continue 表示跳過某一次的迴圈進入到下次迴圈，本次條件符合，continue 後面的語句則不會被執行
舉例
for 迴圈跳過某次執行
<script>
// 可以看到輸出結果，唯獨沒有列印 5 ，因為被 continue 跳過了
for (var i = 0; i < 10; i++) {
if (i == 5) {
continue;
}
console.log(i);
}
</script>
while 迴圈跳過某次執行
<script>
var i = 0;
while (i < 10) {
if (i == 5) {
i = 6;
continue;
}
console.log(i);
i++;
}
</script>
do…while 跳過某次執行
<script>
var i = 0;
do {
console.log(i);
i++;
if (i == 5) {
i = 6;
continue;
}
} while (i < 10);
</script>
死迴圈
死迴圈是永遠也不退出的迴圈
死迴圈有時候是我們故意寫的，比如 一直執行某個任務
for 死迴圈
// for 迴圈表達式中什麼也不寫，即為 死迴圈，即不會主動退出的迴圈
for(;;) {
// 迴圈體
}
while 死迴圈
while (true) { console.log("run...");}
do-while 死迴圈
do { console.log("run...");} while(true);
微信公眾號
