JavaScript 条件循环语句

条件循环语句‌是编程中的一种控制结构,它允许程序根据特定条件重复执行一段代码,直到满足某个条件为止。这种结构通常包括条件语句和循环语句,它们共同作用,使得程序能够根据预设的条件来决定是否继续执行循环体中的代码。

for 循环:

  • 适用场景:当知道循环次数时(循环次数已知)。
  • 特点:可在一行中定义初始化、条件和增量,结构紧凑。

|---------|-----------------------------------------------------------------------|
| 运算符 | 描述 |
| 初始化变量 | 通常用于初始化一个计数器,该表达式可以使用 var 或者 let 关键字声明新的变量,这个变量帮我们来记录次数。推荐使用 let. |
| 条件表达式 | 用于确定每一次循环是否能被执行,如果结果是 true 就继续循环,否则退出循环。 |
| 操作表达式 | 每次循环的最后都要执行的表达式。通常用于更新计数器变量的值。 |

语法:
for循环语法

for(初始化变量①;  条件表达式②;  操作表达式③  ){
// 循环体④
}
示例:
for (let i = 1; i <= 5; i++) {
    console.log("这是第 " + i + " 次循环");
}
执行流程:
  1. 初始化变量,初始化操作在整个 for 循环只会执行一次。
  2. 继续执行操作表达式,第二轮结束。......
  3. 第二轮开始,直接去执行条件表达式(不再初始化变量),如果为 true,则去执行循环体语句,否则退出循环。
  4. 执行操作表达式,此时第一轮结束。
  5. 执行条件表达式,如果为 true,则执行循环体语句,否则退出循环,循环结束。

整体执行顺序为:① ② ④ ③ ② ④ ③ ② ④ ③ ...... ② 循环结束

for 循环嵌套for 循环:

for  (外循环的初始①;  外循环的条件②;  外循环的操作表达式③)  {
for  (内循环的初始④;  内循环的条件⑤;  内循环的操作表达式⑥)  {
// 需执行的代码⑦;
}
}

整体执行顺序为:① ② ④ ⑤ ⑦ ⑥ ⑤ ⑦ ⑥ ⑤ ...... ⑤ 内循环结束 ③ ② ④ ⑤

⑦ ⑥ ⑤ ⑦ ⑥ ⑤ ...... ⑤ 内循环结束 ③ ...... ② 外循环结束。

2. while 循环

while 循环在条件为真时重复执行代码。适合于不确定循环次数的情况。与for循环不同,while循环的条件是在每次迭代中指定的。只要条件为真,循环就会继续执行。一旦条件为假,循环就会立即停止。

  • 特点:先检查条件,条件为真时执行循环体,适合需要动态判断的情况。
  • 适用场景:当不确定循环次数时,需基于条件进行判断。
语法:
while  (条件表达式)  {
// 循环体代码
}
//  1.  先执行条件表达式,如果结果为  true,则执行循环体代码;
//	如果为  false,则退出循环,执行后面代码
//  2.  执行循环体代码
//  3.  循环体代码执行完毕后,程序会继续判断执行条件表达式。
示例:
let count = 1;

while (count <= 5) {
    console.log("这是第 " + count + " 次循环");
    count++; // 增加计数
}

3. do...while 循环

do...while 循环至少会执行一次循环体,因为条件检查是在循环之后进行的。do while 是先执行代码,在进行判断,所以 do while 至少执行一次。

  • 特点:先执行循环体,然后检查条件,确保至少执行一次。
  • 适用场景:至少需要执行一次循环体的情况。
语法:
do {
//  循环体代码  -  条件表达式为  true  时重复执行循环体代码
}  while(条件表达式);
示例:
let count = 1;

do {
    console.log("这是第 " + count + " 次循环");
    count++;
} while (count <= 5);

4.练习题

练习题1.九九乘法口诀

练习题2. 一百以内的加法

练习题3.一百以内偶数加法

5.答案

练习题1答案

  // for循环实现九九乘法口诀
				for (let i = 1; i <= 9; i++) {
					for (let j = 1; j <= i; j++) {
						document.write(j + 'x' + i + '=' + i * j + '  ');
					}
					document.write('<br/>');
				}
  // while实现九九乘法口诀
				let i = 1;
				let j = 1;
				while (i <= 9) {
					j = 1;
					while (j <= i) {
						document.write(j + '*' + i + '=' + i * j + '  ');
						j++;
					}
					document.write('<br/>'); // 换行
					i++;
				}
  // do while实现九九乘法口诀
				let u = 1;
				let g = 1;
				do {
					g = 1;
					while (g <= u) {
						document.write(u + "x" + g + "=" + u * g + "  ");
						g++;
					}
					document.write('<br/>'); // 换行
					u++;
				} while (u <= 9);

练习题2答案

	// for循环实现一百以内的加法
			let sum = 0
			for (let i = 1; i <= 100; i++) {
				sum += i;
			}
			document.write(sum);
	// while循环实现一百以内的加法
			let l = 1;
			let q = 0;
			while (l <= 100) {
				q += l;
				l++;
			}
			console.log(q);
   // do while循环实现一百以内的加法
			let y = 1;
			let x = 0;
			do {
				x += y;
				y++;
			}
			while (y <= 100);
			console.log(x);

练习题3答案

	// for循环实现一百以内偶数加法
			let add = 0;
			for (let z = 1; z <= 100; z++) {
				if (z % 2 == 0) {
					add += z;
				}
			}
			document.write(add);
			document.write('<br/>');
			
	 // while循环实现一百以内偶数加法
			let s = 1;
			let and = 0;
			while (s <= 100) {
				if (s % 2 == 0) {
					and += s;
				}
				s++;
			}
			console.log(and);
			
	// do while循环实现一百以内偶数加法
			let n = 1;
			let m = 0;
			do {
				if (n % 2 == 0) {
					m += n;
				}
				n++;
			} while (n <= 100);
			console.log(m);

总结:

  • 循环语句 :用于重复执行代码块(forwhiledo...while)。
  • 希望这篇文章能帮助你理解 JavaScript 的条件与循环语句!
相关推荐
重生之我是数学王子3 分钟前
QT基础 编码问题 定时器 事件 绘图事件 keyPressEvent QT5.12.3环境 C++实现
开发语言·c++·qt
℘团子এ3 分钟前
vue3中如何上传文件到腾讯云的桶(cosbrowser)
前端·javascript·腾讯云
Ai 编码助手4 分钟前
使用php和Xunsearch提升音乐网站的歌曲搜索效果
开发语言·php
学习前端的小z8 分钟前
【前端】深入理解 JavaScript 逻辑运算符的优先级与短路求值机制
开发语言·前端·javascript
神仙别闹16 分钟前
基于C#和Sql Server 2008实现的(WinForm)订单生成系统
开发语言·c#
XINGTECODE17 分钟前
海盗王集成网关和商城服务端功能golang版
开发语言·后端·golang
前端百草阁32 分钟前
【TS简单上手,快速入门教程】————适合零基础
javascript·typescript
彭世瑜32 分钟前
ts: TypeScript跳过检查/忽略类型检查
前端·javascript·typescript
FØund40433 分钟前
antd form.setFieldsValue问题总结
前端·react.js·typescript·html
Backstroke fish34 分钟前
Token刷新机制
前端·javascript·vue.js·typescript·vue