一、while 循环
1、while 循环概念
JavaScript 中的 do-while 循环 是 while 循环的变体 , 是 一种 后测试 循环 , 该循环的 循环体 至少执行一次 , 然后 再 检查 " 条件表达式 " 的 布尔值结果 , 以 决定是否继续循环 ;
- 如果 " 条件表达式 " 为 true , 则 执行 循环体 ;
- 如果 " 条件表达式 " 为 false, 则 不执行 循环体 , 退出循环 , 继续执行循环后面的代码 ;
do-while 循环 与 while 循环 的区别是 :
- do-while 循环 先执行一次 循环体 , 至少执行一次 ;
- while 循环 判断 " 条件表达式 " 决定是否执行循环体 , 如果 条件不满足 则一次都不会执行 ;
2、do-while 循环语法结构
do-while 循环语法结构 :
do {
// 循环体代码
} while (条件表达式); // 条件：当此条件为真时，循环体会继续执行
执行后 , 不管 条件表达式 的结果是否为 true , 都先执行一次 " 循环体代码 " ,
然后再 判定 " 条件表达式 " , 决定是否继续执行 " 循环体代码 " ;
二、do-while 循环代码示例
1、打印 1-5 数字
代码示例 :
let i = 1;
do {
console.log(i);
i++;
} while (i <= 5);
在上述 do-while 循环 中 , 先执行 循环体代码 , 打印变量 i 的值 , 并将 i 的值增加 1 ;
然后 , 它会检查 i 是否小于或等于 5 ,
- 如果是 , 条件表达式为 true , 再次执行 循环体代码 ;
- 如果不是 , 如 : 当 i 的值变为 6 时 , 条件表达式变为 false , 循环结束 , 执行后续代码 ;
完整代码示例 :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- 设置 meta 视口标签 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaScript</title>
<style></style>
<script>
// do-while 循环
let i = 1;
do {
console.log(i);
i++;
} while (i <= 5);
</script>
</head>
<body>
</body>
</html>
执行结果 :
2、打印 1-10 累加和
代码示例 :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- 设置 meta 视口标签 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaScript</title>
<style></style>
<script>
// do-while 循环
let i = 1;
let sum = 0;
do {
sum += i;
i++;
} while (i <= 10);
console.log(sum);
</script>
</head>
<body>
</body>
</html>
执行结果 :