TypeScript 循环
最后修改于 2025 年 1 月 24 日
TypeScript 中的循环用于重复执行一段代码，直到满足特定条件为止。TypeScript 支持多种类型的循环，包括 for、while 和 do-while 循环。本教程通过实际示例介绍了 TypeScript 循环的基础知识。
循环是允许你多次重复执行一段代码的控制结构。它们对于迭代数组、处理数据和执行重复性任务非常有用。TypeScript 循环与 JavaScript 循环类似，但增加了类型安全的优点。
For 循环
此示例演示了如何使用 for 循环来迭代数组。
let numbers: number[] = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
for 循环用于迭代 numbers 数组。循环变量 i 在每次迭代时都会递增，并且循环会一直持续到 i 小于数组长度为止。
For-Of 循环
此示例演示了如何使用 for-of 循环来迭代数组。
let fruits: string[] = ["Apple", "Banana", "Cherry"];
for (let fruit of fruits) {
console.log(fruit);
}
// Output:
// Apple
// Banana
// Cherry
for-of 循环用于迭代 fruits 数组的元素。与传统的 for 循环相比，此循环更简洁易读。
While 循环
此示例演示了如何使用 while 循环来重复执行一段代码，直到满足条件为止。
let count: number = 0;
while (count < 5) {
console.log(count);
count++;
}
只要条件 count < 5 为真，while 循环就会继续执行。循环变量 count 在每次迭代时都会递增。
Do-While 循环
此示例演示了如何使用 do-while 循环至少执行一次代码块。
let count: number = 0;
do {
console.log(count);
count++;
} while (count < 5);
即使条件为假，do-while 循环也至少执行一次代码块。只要条件 count < 5 为真，循环就会继续执行。
嵌套循环
此示例演示了如何使用嵌套循环来迭代多维数组。
let matrix: number[][] = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
for (let i = 0; i < matrix.length; i++) {
for (let j = 0; j < matrix[i].length; j++) {
console.log(matrix[i][j]);
}
}
嵌套循环用于迭代多维数组的每个元素。外层循环迭代行，内层循环迭代列。
Break 和 Continue
此示例演示了如何在循环中使用 break 和 continue 语句。
for (let i = 0; i < 10; i++) {
if (i === 5) {
break; // Exit the loop when i is 5
}
if (i % 2 === 0) {
continue; // Skip even numbers
}
console.log(i);
}
// Output:
// 1
// 3
当 i 为 5 时，break 语句会退出循环，而 continue 语句会跳过偶数。这些语句提供了对循环执行的额外控制。
使用循环的最佳实践
- 使用正确的循环：根据任务选择合适的循环类型（
for、while、do-while）。 - 避免无限循环：确保循环条件最终会变为 false，以避免无限循环。
- 优化性能：尽量减少循环内的操作次数以提高性能。
- 谨慎使用 Break 和 Continue：明智地使用
break和continue语句以保持代码的可读性。
来源
在本文中，我们探讨了 TypeScript 循环，并通过实际示例展示了它们的使用方法。