前言本文是JavaScript基础系列的第四篇重点讲解三种循环结构的进阶用法嵌套for循环含图形打印、九九乘法表、质数判断等经典案例、while循环适合不确定次数的循环场景以及do...while循环至少执行一次的循环。文末附有循环类型对比总结帮助你在实际开发中选择最合适的方案。一、嵌套for循环1. 什么是循环嵌套循环嵌套是指在一个循环语句内部再定义一个循环语句的语法结构。最常见的就是在for循环中再嵌套一个for循环称为双重for循环。2. 语法结构for (外层初始化表达式; 外层条件表达式; 外层操作表达式) { for (内层初始化表达式; 内层条件表达式; 内层操作表达式) { // 执行语句 } }3. 执行思路内层循环可以看作外层循环的循环体语句。外层循环每执行1次内层循环会执行全部次数。可以理解为外层循环控制行数内层循环控制每行的内容。4. 图形打印示例1打印矩形5行5列for (let i 0; i 5; i) { for (let j 0; j 5; j) { document.write(*); } document.write(br/); }输出结果***** ***** ***** ***** *****2打印正直角三角形for (let i 1; i 5; i) { for (let j 0; j i; j) { document.write(*); } document.write(br/); }输出结果* ** *** **** *****规律内层循环的次数j i随着外层i增大每行星号数递增。3打印倒直角三角形for (let i 0; i 5; i) { for (let j 5; j i; j--) { document.write(*); } document.write(br/); }输出结果***** **** *** ** *规律内层循环从5开始递减每行星号数递减。5. 九九乘法表for (let i 1; i 9; i) { for (let j 1; j i; j) { document.write(${j} * ${i} ${i * j}nbsp;nbsp;); } document.write(br/); }输出效果1 * 1 1 1 * 2 2 2 * 2 4 1 * 3 3 2 * 3 6 3 * 3 9 ...关键点内层循环条件j i确保只打印下三角部分。6. 经典算法输出1-100之间的质数质数定义大于1的自然数除了1和自身外不能被其他自然数整除。方法一正向判断计数法for (let i 2; i 100; i) { let count 0; for (let j 2; j i; j) { if (i % j ! 0) { count; } } if (count i - 2) { console.log(${i}是质数); } }方法二反向判断标志位法推荐for (let i 2; i 100; i) { let flag true; // 假设i是质数 for (let j 2; j i; j) { if (i % j 0) { flag false; // 发现能被整除不是质数 break; // 跳出内层循环提高效率 } } if (flag) { console.log(${i}是质数); } }推荐理由一旦发现能被整除立即标记并跳出内层循环减少不必要的计算。二、while循环while语句可以在条件表达式为真的前提下循环执行指定的一段代码直到表达式不为真时结束循环。适用场景不确定循环次数时优先使用while循环。1. 语法结构初始化表达式; while (条件表达式) { // 循环体代码 // 更新表达式 }2. 执行流程判断条件表达式是否为true若为true执行循环体代码循环体执行完毕后再次判断条件表达式直到条件为false时退出循环3. 注意事项while循环里也需要计数器初始化变量while循环里应该有操作表达式来完成计数器的更新防止死循环4. 示例1打印1-100岁let i 1; while (i 100) { document.write(${i}岁br/); i; }2计算1-100整数和let i 1, sum 0; while (i 100) { sum i; i; } console.log(sum); // 输出50503循环弹窗直到输入我爱你let str; while (true) { str prompt(你爱我吗); if (str 我爱你) { break; // 输入正确退出循环 } }三、do...while循环do...while语句是while语句的一个变体该循环会先执行一次代码块然后对条件表达式进行判断如果条件为真就会重复执行循环体否则退出循环。1. 语法结构do { // 循环体代码 } while (条件表达式);2. 特点先执行一次循环体再判断条件如果条件表达式结果为真则继续执行循环体否则退出循环do...while可以保证循环体至少执行一次而while不行3. 示例告白成功let str; do { str prompt(你爱我吗); } while (str ! 我爱你);对比while版本使用do...while时即使第一次就输入我爱你也会先执行一次提示框体验上略有不同。四、三种循环对比总结循环类型特点适用场景for循环明确循环次数计数器、条件、更新集中在一起遍历数组、打印图形、已知次数的循环while循环先判断后执行可能一次都不执行条件满足时才循环不确定循环次数do...while循环先执行后判断至少执行一次至少需要执行一次的场景如用户输入验证选择建议知道要循环多少次 → 用for不知道次数但知道何时停止 → 用while无论如何都要先执行一次 → 用do...while总结本文系统讲解了JavaScript中三种循环结构的进阶用法嵌套for循环外层控制行数内层控制列数适合打印图形、表格等二维结构。while循环先判断后执行适合条件驱动的循环场景。do...while循环先执行后判断保证至少执行一次。通过质数判断、九九乘法表、图形打印等经典案例相信你已经掌握了循环的实际应用技巧。下一篇将继续深入数组、函数等进阶内容欢迎持续关注
