TypeScript 循环
有的时候,我们可能需要多次执行同一块代码。一般情况下,语句是按顺序执行的:函数中的第一个语句先执行,接着是第二个语句,依此类推。
编程语言提供了更为复杂执行路径的多种控制结构。
循环语句允许我们多次执行一个语句或语句组,下面是大多数编程语言中循环语句的流程图:
for 循环
TypeScript for 循环用于多次执行一个语句序列,简化管理循环变量的代码。
语法
语法格式如下所示:
for ( init; condition; increment ){
statement(s);
}
下面是 for 循环的控制流程解析:
init 会首先被执行,且只会执行一次。这一步允许您声明并初始化任何循环控制变量。您也可以不在这里写任何语句,只要有一个分号出现即可。
接下来,会判断 condition。如果为 true,则执行循环主体。如果为 false,则不执行循环主体,且控制流会跳转到紧接着 for 循环的下一条语句。
在执行完 for 循环主体后,控制流会跳回上面的 increment 语句。该语句允许您更新循环控制变量。该语句可以留空,只要在条件后有一个分号出现即可。
条件再次被判断。如果为 true,则执行循环,这个过程会不断重复(循环主体,然后增加步值,再然后重新判断条件)。在条件变为 false 时,for 循环终止。
在这里,statement(s) 可以是一个单独的语句,也可以是几个语句组成的代码块。
condition 可以是任意的表达式,当条件为 true 时执行循环,当条件为 false 时,退出循环。
//例:使用 for 循环轻松输出 1 到 10 之间的数字 for(let i=1; i<=10; i++){ console.log(i); }
代码解释:
初始化:let i = 1 初始化循环变量 i,从 1 开始。
条件:i <= 10 是循环条件,只要 i 小于或等于 10,循环就会继续。
迭代:i++ 每次循环结束后将 i 的值加 1。
输出:console.log(i) 打印当前的 i 值。
编译运行:
//例: for 循环 输出 100到89之间的数 for(let i=100; i>=89; i--){ console.log(i); }
代码解释:
初始化:let i = 100 初始化循环变量 i,从 100 开始。
条件:i >= 89 是循环条件,只要 i 大于或等于 89,循环就会继续。
迭代:i-- 每次循环结束后将 i 的值减 1。
输出:console.log(i) 打印当前的 i 值。
编译运行:
for...in 循环
for...in 语句用于一组值的集合或列表进行迭代输出。
语法
语法格式如下所示:
for (var val in list) {
//语句
}
val 需要为 string 或 any 类型。
//例: for in循环 输出一组值a b c集合 var j:any; var n:any="a b c"; for(j in n){ console.log(n[j]); }
代码分析:
变量声明:
var j: any;
声明了一个变量 j,类型为 any,表示 j 可以是任意类型。
var n: any = "a b c";
声明了一个变量 n,类型为 any,并赋值为字符串 "a b c"。
for-in 循环:
for (j in n)
这是一个 for-in 循环,用于遍历对象(或数组、字符串)的可枚举属性。
在这里,n 是一个字符串 "a b c"。
字符串在 TypeScript/JavaScript 中可以被视为字符数组,因此 for-in 会遍历字符串的索引。
循环体:
console.log(n[j]);
在每次循环中,j 是当前遍历的索引(字符串的索引从 0 开始),n[j] 是字符串 n 中索引为 j 的字符。
例如:
当 j = 0 时,n[j] 是 'a'。
当 j = 1 时,n[j] 是 ' '(空格)。
当 j = 2 时,n[j] 是 'b'。
以此类推。
代码执行过程:
初始化变量 n 为字符串 "a b c"。
for-in 循环遍历字符串 n 的索引:
j 依次为 0, 1, 2, 3, 4, 5(字符串 "a b c" 的长度为 6)。
在每次循环中,n[j] 会输出字符串 n 中对应索引的字符。
解释:
索引 0:'a'
索引 1:' '(空格)
索引 2:'b'
索引 3:' '(空格)
索引 4:'c'
索引 5:undefined(字符串长度为 5,索引 5 超出范围)
注意事项:
for-in 的用途:
for-in 通常用于遍历对象的属性。对于数组或字符串,更推荐使用 for-of 或普通的 for 循环。
如果使用 for-in 遍历字符串,会遍历字符串的索引(而不是字符本身)。
改进建议:
如果需要遍历字符串的字符,可以使用 for-of 循环:
//改进建议:如果需要遍历字符串的字符,可以使用 for-of 循环 for(let char of n){ console.log(char); }
或者使用普通的for循环
//或者使用普通的 for 循环: for(let i=0; i<n.length; i++){ console.log(n[i]); }
编译运行:
while 循环
while 语句在给定条件为 true 时,重复执行语句或语句组。循环主体执行之前会先测试条件。
语法
语法格式如下所示:
while(condition)
{
statement(s);
}
在这里,statement(s) 可以是一个单独的语句,也可以是几个语句组成的代码块。
condition 可以是任意的表达式,当条件为 true 时执行循环。 当条件为 false 时,程序流将退出循环。
//while 循环 //例: 计算1到10的和 let sum:number=0; let i:number=1; while(i<=10){ sum+=i; i++; } console.log("1到10的和为:",sum);
编译运行:
//例: 打印 1 到 5 的数字 let j:number=1; while(j<=5){ console.log(j); j++; }
编译运行:
//例: 查找数组中第一个大于 10 的元素 let numbers=[5,8,12,3,15]; let index=0; while(index<numbers.length && numbers[index]<=10){ index++; } if(index<numbers.length){ console.log("第一个大于10的元素是:", numbers[index]); }else{ console.log("没有找到大于10的元素"); }
编译运行:
do...while 循环
不像 for 和 while 循环,它们是在循环头部测试循环条件。do...while 循环是在循环的尾部检查它的条件。
语法
语法格式如下所示:
do
{
statement(s);
}while( condition );
请注意,条件表达式出现在循环的尾部,所以循环中的 statement(s) 会在条件被测试之前至少执行一次。
如果条件为 true,控制流会跳转回上面的 do,然后重新执行循环中的 statement(s)。这个过程会不断重复,直到给定条件变为 false 为止。
//do while循环 //例: 计算 1 到 10 的和 let sum:number=0; let i:number=1; do{ sum+=i; i++; }while(i<=10); console.log("1到10的和为:",sum); //例:打印到5的数字 let j:number=1; do{ console.log(j); j++; }while(j<=5);
编译运行:
while 循环 与 do...while 循环 的区别
while 循环:先判断条件,条件为 true 时执行循环体。
do...while 循环:先执行循环体,再判断条件,条件为 true 时继续循环。
do...while 循环至少会执行一次,即使初始条件为 false。
// while 循环 与 do while循环的区别 // 例 1: 初始条件不满足时 let condition = false; // while 循环 while (condition) { console.log("while 循环执行了"); // 不会执行 } // do...while 循环 do { console.log("do...while 循环执行了"); // 会执行一次 } while (condition); // 例 2: 循环次数不同 let count = 0; // while 循环 while (count < 5) { console.log("while 循环:", count); count++; } // 输出: // while 循环: 0 // while 循环: 1 // while 循环: 2 // while 循环: 3 // while 循环: 4 count = 0; // do...while 循环 do { console.log("do...while 循环:", count); count++; } while (count < 5); // 输出: // do...while 循环: 0 // do...while 循环: 1 // do...while 循环: 2 // do...while 循环: 3 // do...while 循环: 4 // 例 3: 循环条件为 false 时 let flag = false; // while 循环 while (flag) { console.log("while 循环执行了"); // 不会执行 } // do...while 循环 do { console.log("do...while 循环执行了"); // 会执行一次 } while (flag);
