Z
ZHANK
流程控制

循环语句

学习 for、while、do-while、for...of 循环

循环语句

循环让你重复执行代码块,是编程的核心能力。

学完本章你将: 掌握 for、while、do-while、for...of 循环。


for 循环

javascript
// 经典 for 循环
for (let i = 0; i < 5; i++) {
    console.log(`第 ${i + 1} 次循环`);
}

// 遍历数组
let colors = ["红", "绿", "蓝", "黄"];
for (let i = 0; i < colors.length; i++) {
    console.log(colors[i]);
}

while 循环

javascript
// 前置条件:先判断再执行
let count = 0;
while (count < 5) {
    console.log(`count = ${count}`);
    count++;
}

// do-while:先执行一次再判断
let num = 0;
do {
    console.log(`num = ${num}`);
    num++;
} while (num < 3);

for...of(推荐遍历数组)

javascript
let fruits = ["apple", "banana", "orange"];

// 遍历值
for (let fruit of fruits) {
    console.log(fruit);
}

// 遍历字符串
for (let char of "Hello") {
    console.log(char);
}
// H e l l o

for...in(遍历对象键)

javascript
let person = { name: "Alice", age: 25, city: "北京" };

// 遍历对象属性
for (let key in person) {
    console.log(`${key}: ${person[key]}`);
}
// name: Alice
// age: 25
// city: 北京

break 与 continue

javascript
// break:立即退出循环
for (let i = 0; i < 10; i++) {
    if (i === 5) break;
    console.log(i);
}
// 0 1 2 3 4

// continue:跳过当前迭代
for (let i = 0; i < 8; i++) {
    if (i % 2 === 0) continue; // 跳过偶数
    console.log(i);
}
// 1 3 5 7

循环性能对比

循环方式场景可中断
`for`需要索引
`for...of`遍历数组值
`for...in`遍历对象键
`forEach`函数式遍历
`while`未知循环次数