本節我們學習迴圈，什麼是迴圈呢，從字面意思就可以看就是重複多次執行程式碼。
TypeScript 中的 for 迴圈和 for...in 循的使用就和 JavaScript 中的一樣。此外，TypeScript 中還還支援 for…of 、forEach、every 和 some 迴圈。
for迴圈
TypeScript 語言中的 for 迴圈可以用於多次執行一個程式碼塊。例如一句程式碼重複執行 10 次、100次、1000次等，都可以通過迴圈來實現。
語法如下所示：
for ( init; condition; increment ){
// 程式碼塊
}其中 init 是迴圈控制變數，會在迴圈最開始的時候執行，且只會執行一次。condition 是迴圈條件，當條件為 true 時會執行迴圈中的程式碼塊，為 false 時則停止執行迴圈。increment 用於更新迴圈控制變數，當迴圈中的程式碼塊執行完畢後，控制流會跳回到這個語句。
示例：
迴圈輸出數字 0 到 4：
let num:number = 5;
let i:number;
for (i = 0; i < num; i++){
console.log(i);
}編譯成 JavaScript 程式碼：
var num = 5;
var i;
for (i = 0; i < num; i++) {
console.log(i);
}輸出：
0
1
2
3
4我們來看下上面程式碼的執行流程：
- 首先程式中的程式碼都是自上而下執行，所以在迴圈開始執行之前會執行這兩句程式碼：
let num:number = 5;
let i:number;- 然後看到迴圈部分，首先被執行的是
i = 0，初始化迴圈的控制變數變數，然後判斷給出的迴圈條件i < num，如果滿足這個條件，則執行迴圈中的程式碼塊。所以此時輸出了0，這就是第一次迴圈。 - 接著開始第二次迴圈，控制流會跳回到
i++語句部分，這條語句用於更新迴圈控制變數，所以此時 i 的值加1。知道了i的值為 1 後，迴圈條件再次被判斷，此時i < num仍舊滿足，所以繼續執行迴圈中的程式碼塊，輸出1，這是第二次迴圈。 - 然後就跟上面的步驟一樣，繼續第三次、第四次...等的迴圈。一直到迴圈條件
i < num不滿足時，迴圈就會結束。
for...in 迴圈
for...in 是 for 迴圈的另一個變體， for...in 語句可以用於一組值的集合或列表進行迭代輸出。
語法格式如下所示：
for (var val in list) {
//程式碼塊
}val 的資料型別為 string 或者 any 型別。
示例：
例如我們宣告一個陣列，然後使用 for...in 迴圈來遍歷這個陣列：
let myArr:string[] = ['a', 'b', 'c', 'd'];
let i:string;
for (i in myArr){
console.log(myArr[i]);
}編譯成 JavaScript 程式碼：
var myArr = ['a', 'b', 'c', 'd'];
var i;
for (i in myArr) {
console.log(myArr[i]);
}輸出：
a
b
c
dfor...of迴圈
ES6 中引入了 for...of 迴圈，用來替代for...in 和 forEach()。for...of 語句建立一個迴圈來迭代可迭代的物件。可以用於遍歷字串、陣列、對映、集合等可迭代的資料結構。
示例：
使用 for...of 語句遍歷陣列：
let myArr:string[] = ['a', 'b', 'c', 'd'];
let i;
for (i of myArr){
console.log(i);
}編譯成 JavaScript 程式碼：
var myArr = ['a', 'b', 'c', 'd'];
var i;
for (var _i = 0, myArr_1 = myArr; _i < myArr_1.length; _i++) {
i = myArr_1[_i];
console.log(i);
}輸出：
a
b
c
dforEach 迴圈
forEach() 方法是一個陣列方法，用於對陣列中的每個項執行一個函式。
語法如下所示：
array.forEach(callback[, thisObject]); forEach() 方法按升序對陣列中的每個元素執行一次提供的回撥。callback 回撥函式時一個用於測試每個元素的函式，接受三個可選引數，第一個引數為元素值 value ，第二個引數為元素索引 index，第三個引數為 Array，是一個在 forEach() 方法中迭代的陣列。thisObject 是執行回撥時使用的物件。
示例：
迴圈一個陣列：
let username:string[] = ['楊過', '黃蓉', '郭靖', '梅超風'];
username.forEach(function(item){
console.log(item);
});編譯成 JavaScript 程式碼：
var username = ['楊過', '黃蓉', '郭靖', '梅超風'];
username.forEach(function (item) {
console.log(item);
});輸出：
楊過
黃蓉
郭靖
梅超風使用 forEach() 方法其實有一個缺點，就是它沒有提供停止或者中斷迴圈的方法，且它只對陣列有效。所以我們可以使用 every 和 some 來代替 forEach 迴圈。
every 迴圈
every() 方法測試陣列中的所有元素是否通過由提供的函式實現的測試。如果陣列中的每個元素都滿足提供的測試功能，則返回true。否則返回 false。
語法如下所示：
array.every(callback[, thisObject]);every() 方法的語法和forEach() 方法類似，其中 callback 是一個回撥函式，thisObject 為執行回撥時用作此物件的物件。
示例：
let numArr:number[] = [1, 2, 3, 4, 5];
let result = numArr.every(function compare(element, index, array) {
return (element < 10);
});
console.log(result);編譯為 JavaScript 程式碼：
var numArr = [1, 2, 3, 4, 5];
var result = numArr.every(function compare(element, index, array) {
return (element < 10);
});
console.log(result);輸出：
true上述程式碼中因為陣列 numArr 中的每個元素都通過了由函式compare 提供的測試，所以返回結果為 true。
some 迴圈
some() 方法用於測試陣列中的某些元素是否通過由提供的函式實現的測試。
some() 方法和 every() 方法很類似，但是兩者又還有一些區別，some() 方法會遍歷陣列中的每一項，如果其中一項為 true，則返回值為true。every() 方法則需要全部為true ，結果才為 true。
示例：
let numArr:number[] = [7, 10, 15, 21];
let result = numArr.some(function compare(element, index, array) {
return (element < 10);
});
console.log(result);編譯成 JavaScript 程式碼：
var numArr = [7, 10, 15, 21];
var result = numArr.some(function compare(element, index, array) {
return (element < 10);
});
console.log(result);輸出：
true上述程式碼中只要陣列 numArr 中的有任何一個元素通過了由函式compare 提供的測試，結果返回值就會為 true。很明顯，陣列中有一個元素 7，滿足小於 10 這個條件，所以最終程式碼輸出結果為 true。
while 迴圈
while 語句在滿足指定迴圈條件時，會重複執行迴圈中的程式碼塊。迴圈主體執行之前會先執行測試條件，如果一開始就不滿足條件，則迴圈不會執行。
語法格式：
while(condition)
{
// 程式碼塊
}示例：
迴圈輸出數字 1 到 5：
var num:number = 1;
while(num <= 5) {
console.log(num);
num++;
} 編譯成 JavaScript 程式碼：
var num = 1;
while (num <= 5) {
console.log(num);
num++;
}輸出：
1
2
3
4
5while 後面小括號中就是指定的迴圈條件，當第一次迴圈時，變數 num 的值一開始為1，滿足 num <= 5 ，輸出 num 的值，然後執行 num++ ，此時 num 的值變為了2。然後繼續第二次迴圈，2 小於 5，所以滿足迴圈條件，執行迴圈中的程式碼塊.... 然後一直到 num <= 5 這個條件不成立，迴圈結束。
do...while 迴圈
do...while 迴圈和 while 迴圈和 for 迴圈不同，for 和 while 迴圈是在迴圈頭部測試迴圈條件，do...while 迴圈是在迴圈的尾部檢查它的條件。且 do...while 迴圈會在條件被測試之前至少執行一次。
語法格式如下所示：
do{
// 程式碼塊
}while( condition );示例：
var num:number = 1;
do {
console.log(num);
num++;
} while(num == 5);編譯成 JavaScript 程式碼：
var num = 1;
do {
console.log(num);
num++;
} while (num == 5);輸出：
1我們來看上面這段程式碼，在上面這個 do...while 迴圈中我們給定的迴圈條件為 num == 5 ，但此時 num 的值為 1，很顯然不滿足條件，但是從輸出結果我們可以看出，迴圈執行了一次。這正是do...while 迴圈的與眾不同，就是即使不滿足條件，迴圈也至少會執行一次。
總結
對於迴圈來說，我們常見的還是 for 迴圈和 while 迴圈，那麼什麼情況下使用這兩種迴圈呢？
- 一般知道執行次數的使用選擇使用
for迴圈，而while可以在不確定迴圈次數的時候使用。 - 可以根據具體需要使用這兩種迴圈，但是可以優先考慮
for迴圈，因為一般情況下for迴圈效率較高。