JavaScript循环语句

164 阅读1分钟

断点调试

作用:可以帮助更好的理解代码运行,工作时可以更快找到bug

使用方法:浏览器打开调试界面

1.按F12打开开发者工具

2.点到sources(源代码)一栏

3.选择代码文件

断点:在某句代码上加的标记就叫断点,当程序执行到这句有标记的代码时会暂停下来

1、while循环

语法:

while (循环条件) {
    要重复执行的代码(循环体)
}
let i = 3;
while (i < 5) { // 一直满足条件,就会一直循环
    alert('满足条件就执行我');
    i++;  // 让i自增,可以自动跳出循环
}

释义:

while大括号里代码执行完毕后不会跳出,而是继续回到小括号里判断条件是否满足,若满足又执行大括号里的代码,然后再回到小括号判断条件,直到括号内条件不满足,即跳出

简易ATM取款机案例

    let money = 800; // 总金额
    let takeMoney;// 取走的钱
    let getMoney;// 存的钱
    let num; // 判断用户输入的数字
​
    while (num !== 4) {
      num = +prompt(`请选择您的操作:
        1.取款
        2.存款
        3.查看余额
        4.退出`)
      if (num === 1) {
        takeMoney = +prompt('你要取多少钱') // 取走的钱
        alert(`您取了${takeMoney}`)
        if (takeMoney <= money) {
          money = money - takeMoney; // 取走钱后还剩多少钱
        } else {
          alert(`余额不足,你还剩${money}`)
        }
      } else if (num === 2) {
        getMoney = +prompt('您要存多少钱') // 存的钱
        alert(`您存了${getMoney}`)
        money = money + getMoney; // 存钱后还剩多少钱
      } else if (num === 3) {
        alert(`您还剩${money}`)
      }
    }

2、for循环

语法:

for (声明记录循环次数的变量;循环条件;变化值) {
    循环体
}
     
// 打印 1-100
for (let i = 1; i <= 100; i++) {
  console.log(i);
}
/*
      执行顺序:
        1. let i = i
        2. 判断是否符合循环条件 i <= 100
        3. 执行循环体的内容
        4. i++
        
        下一次循环
        2. 判断是否符合循环条件 i <= 100
        3. 执行循环体的内容
        4. i++
        。。。
     */

for循环和while循环的区别:

当如果明确了循环的次数的时候推荐使用for循环 当不明确循环的次数的时候推荐使用while循环

3、退出循环

continue:结束本次循环,继续下次循环

for (let index = 1; index <= 10; index++) {
         // 判断当前的index是不是奇数
         if (index % 2 !== 0) {
            console.log(index); // 打印奇数
            continue; // 跳出本次循环,并不执行后面的代码,开始下一次循环
        }
        console.log(index,"⭐");
      }

break:跳出所在的循环

for (let index = 1; index <= 10; index++) {
        // 如果当前的index = 5 ,就不再往下 循环了,就终止循环
        if (index === 5) {
          break; //index === 5时,直接结束循环
        }
        console.log(index);
      }

4、循环嵌套

for (外部声明记录循环次数的变量;循环条件;变化值) {
    for (内部声明记录循环次数的变量;循环条件;变化值) {
        循环体
    }
}
//  打印一个五行五列的星星
for (let index = 1; index <= 5; index++) { // 外层控制行数
      for (let index1 = 1; index1 <= 5; index1++) { // 内层控制每行打印的星星个数
        document.write('⭐')        
      }
      document.write('<br>') // 当内循环结束后就换行
    }