JavaScript循环语句

1. while循环

• 语法如下：

  • 当条件成立时，执行代码块
  • 当条件不成立时，跳出代码块

  

• 如果条件一直成立（为true），那么会产生死循环

  • 这个时候必须通过关闭页面来停止死循环
  • 开发中一定要避免死循环的产生

  // 计算0~99的偶数和
  var count = 0
  var totalCount = 0
  while (count < 100) {
    if (count % 2 === 0) {
      totalCount += count
    }
    count++
  }
  
  console.log("所有的偶数和:", totalCount) // 2450
  
  // 算法优化
  var count = 0
  var totalCount = 0
  while (count < 100) {
    totalCount += count
    count += 2
  }
  
  console.log("所有的偶数和:", totalCount) // 2450
  

2. do..while循环

• do..while循环和while循环非常像，二者经常可以相互替代(不常用)

  • 但是do..while的特点是不管条件成不成立，do循环体都会先执行一次

  

  // 计算0~99的数字和
  var count = 0
  var totalCount = 0
  do {
    totalCount += count
    count++
  } while (count < 100)
  console.log("totalCount:", totalCount) // 4950
  

3. for循环

• 语法

  

  

• begin 执行一次，然后进行迭代：每次检查 condition 后，执行 body 和 step

  // 0~99的奇数和
  var totalCount = 0
  for (var i = 0; i < 100; i++) {
    if (i % 2 !== 0) {
      totalCount += i
    }
  }
  console.log("totalCount:", totalCount) // 2500
  
  // 算法优化
  var totalCount = 0
  for (var i = 1; i < 100; i+=2) {
    totalCount += i
  }
  console.log("totalCount:", totalCount) // 2500
  

4. for循环的嵌套

• 简单理解：外层循环一次，内层循环完整执行执行

• ♥ 组成三角形

  for (var i = 0; i < 6; i++) {
    document.write("<div>")
  
    for (var m = 0; m < i+1; m++) {
      document.write("❤ ")
    }
  
    document.write("</div>")
  }
  

  

• 99乘法表

  document.write("<table>")
  
  for (var i = 0; i < 9; i++) {
    document.write("<tr>")
  
    for (var m = 0; m < i+1; m++) {
      var a = m + 1
      var b = i + 1
      var result = (m+1)*(i+1)
      document.write(`<td>${a}*${b}=${result}</td>`)
    }
  
    document.write("</tr>")
  }
  
  document.write("</table>")
  

  

5. 循环的控制

• break: 直接跳出循环, 循环结束

  • break 某一条件满足时，退出循环，不再执行后续重复的代码

• continue: 跳过本次循环次, 执行下一次循环体

  • continue 指令是 break 的“轻量版”

  • continue 某一条件满足时，不执行后续重复的代码

  var names = ["abc", "cba", "nba", "mba", "bba", "aaa", "bbb"]
  
  // 循环遍历数组
  // break关键字的使用
  // 需求: 遇到nba时, 不再执行后续的迭代
  // for (var i = 0; i < 4; i++) {
  //   console.log(names[i])
  //   if (names[i] === "nba") {
  //     break
  //   }
  // }
  
  // continue关键字的使用: 立刻结束本次循环, 执行下一次循环(step)
  // 需求: 不打印nba
  for (var i = 0; i < 7; i++) {
    if (names[i] === "nba" || names[i] === "cba") {
      continue
    }
    console.log(names[i])
  }