JS中的循环

循环

循环的目的：在实际问题中，有许多规律性的重复操作，因此在程序中要完成这类操作就需要重复执行某些语句

JS中的循环

• for循环
• while循环
• do...while循环
• for...in循环
• for...of循环
• ...

在程序中，一组被重复执行的语句被称为循环体，能否继续重复执行，取决于循环的终止条件。由循环体及循环终止条件组成的语句，被称之为循环语句

for循环

for循环主要用于把某些代码循环若干次，通常跟计数有关系，其语法结构如下：

for(初始化变量;条件表达式;操作表达式) {
    // 循环体
}
// 初始化变量 就是声明的普通变量  通常作为计数器来使用
// 条件表达式 就是来决定每一次循环是否继续执行
// 操作表达式  就是每次循环最后自己执行的代码 经常用于计数器变量更新(递增或递减)
for(let i = 1; i < 10; i++) {
    console.log(11);
}
// 首先执行计数器里面的变量 let i = 1;
// 然后判断i<10是否满足条件，满足条件就去执行循环体中的代码，不满足直接退出循环
// 最后去执行 i++  i++是单独写的代码  递增
// 第二轮循环 继续执行i<10是否满足条件

// 1~100求和
let sum = 0;
for (let i = 1; i <= 100; i++) {
    sum += i;
}
console.log(sum);

// 1~100奇偶数求和
let j = 0, o = 0;
for (let i = 0; i <= 100; i++) {
    if (i % 2 == 0) {
        o += i;
    } else {
        j += i;
    }
}
console.log(o);
console.log(j);

双重for循环

很多情况下，单层for循环并不能满足我们的需求，比如我们要打印一个5行5列的图形，打印一个倒直角三角形等，此时就可以通过循环嵌套来实现

• 循环嵌套是指在一个循环语句中再定义一个循环语句的语法结构，例如在for循环语句中，可以在嵌套一个for循环，这样的for循环语句我们称之为双重for循环

// 打印⭐
let rows = prompt('输入需要打印的行数'),
    cols = prompt('输入需要打印的列数');
let str = '';
for(let i=0;i<rows;i++){
    for(let j = 0;j<cols;j++) {
        str+='⭐'
    };
    str+='\n';
}
console.log(str);

// 倒三角⭐
let rows = prompt('输入需要打印的行数'),
    cols = prompt('输入需要打印的列数');
let str = '';
for(let i=0;i<rows;i++){
    for(let j = i;j<cols;j++) {
        str+='⭐';
    };
    str+='\n';
}
console.log(str);

// 打印九九乘法表
let str = '';
for(let i = 0;i<=9; i++) {
    for(let j = 1; j <=i; j++) {
        str += j + 'x' + i + '=' + i + j + '\t';
    }
    str+='\n';
}
console.log(str);

while循环

while语句可以在条件表达式为真的前提下，循环执行指定的一段代码，直到表达式不为真时结束循环

// while循环语法结构
while (条件语句) {
    // 循环体代码
}
/* 
 * 执行思路：
 * 1. 先执行条件表达式，如果结果为true，则执行循环体代码；如果为false，执行后面代码
 * 2. 执行循环体代码
 * 3. 循环体代码执行完毕后，程序会继续判断执行条件表达式，如果条件仍为true，则继续执行循环体，直到循环条件为false时，整个循环过程才会结束
 */

let message = prompt('你是猪吗？');
while (message !== '是啊'){
    message = prompt('你是猪吗？');
}
alert('猜到了，猪妖！');

do while循环

do while语句其实式while语句的一个变体，该循环会先执行一次代码，然后对条件表达式进行判断，如果条件为真，则重复执行循环体，否则退出循环

// do while 循环语法结构
do {
    // 循环体代码 条件表达式为true时重复执行循环体代码
} while(条件表达式)
// 执行思路：跟while不同的地方在于 do while 先执行一次循环体，在判断条件，如果条件表达式结果为真，则继续执行循环体，否则退出循环

• 先执行循环体，在判断，我们会发现do...while循环语句至少会执行一次循环体代码

do{
    var message = prompt('你是猪吗？');
} while (message !== '是啊');
alert('看出来了');

continue 关键字 和 break 关键字

• continue关键字用于立即跳出本次循环，继续下次循环(本次循环体中的continue之后的代码就会少执行一次)
• break关键字用于立即跳出整个循环(结束循环)

断点调试

断点调试：

• 断点调试是指自己在程序的某一行设置一个断点，调试时，程序执行到这一行就会停住，然后你可以一步一步向下测试，调试过程中可以看各个变量当前的值，出错的话，调试到出错的代码即显示错误，就会停下

• 断点调试可以帮我们观察程序的运行过程

• 浏览器按F12 ==> sources ==> 找到需要调试的文件 ==> 在程序的某一行设置断点
• Watch:监视，通过watch可以监视变量值的变化，观察watch中变量的值的变化
• F11:程序单步执行，让程序一行一方的执行，这个时候，观察watch中变量值的变化