JS基础实战课件06_JavaScript的while和for循环.pdf

JavaScript基础运算符

王红元coderwhy

目录

1认识循环语句

content

2while循环

3do..while循环

4for循环(循环嵌套)

5break、continue

6综合案例练习

coderwhy认识循环

◼在开发中我们经常需要做各种各样的循环操作：

比如把一个列表中的商品、歌曲、视频依次输出进行展示；

比如对一个列表进行累加计算；

比如运行相同的代码将数字1到10逐个输出；

◼循环是一种重复运行同一代码的方法。

如果是对某一个列表进行循环操作，我们通常也会称之为遍历（traversal）或者迭代（iteration）；

◼在JavaScript中支持三种循环方式：

while循环；

do..while循环；

for循环；

coderwhywhile循环

◼while循环的语法如下：

当条件成立时，执行代码块；

当条件不成立时，跳出代码块；

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

这个时候必须通过关闭页面来停止死循环；

开发中一定要避免死循环的产生；

coderwhywhile循环的练习

◼while循环的练习题目：

练习一：打印10次HelloWorld

练习二：打印0~99的数字

练习三：计算0~99的数字和

练习四：计算0~99所有奇数的和

练习五：计算0~99所有偶数的和

coderwhydo..while循环

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

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

◼通常我们更倾向于使用while循环。

coderwhyfor循环

◼for循环更加复杂，但它是最常使用的循环形式。

语句段例子执行过程

beginleti=0进入循环时执行一次。

conditioni3在每次循环迭代之前检查，如果为false，停止循环。

body（循环体）alert(i)条件为真时，重复运行。

stepi++在每次循环体迭代后执行。

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

coderwhyfor循环的练习

◼利用for循环实现之前的案例：

练习一：打印10次HelloWorld

练习二：打印0~99的数字

练习三：计算0~99的数字和

练习四：计算0~99所有奇数的和

练习五：计算0~99所有偶数的和

coderwhyfor循环的嵌套

◼什么是循环的嵌套呢？（日常开发使用不算多，在一些算法中比较常见）

在开发中，某些情况下一次循环是无法达到目的的，我们需要循环中嵌套循环；

◼我们通过for循环的嵌套来完成一些案例：

案例一：在屏幕上显示包含很多❤的矩形

案例二：在屏幕上显示一个三角的❤图像

案例三：在屏幕上显示一个九九乘法表

coderwhy循环控制

◼