目录
一、for循环
语法结构:
for(初始化变量;条件表达式;操作表达式){
//循环体
}
举例:
for (var i = 1; i <= 5; i++) {
console.log('数字为:' + i + '\n');
}
- 初始化变量 初始化一个计数器,用var声明新的变量,这个变量帮我们记录次数。
- 条件表达式 用于执行循环的条件,满足继续执行,不满足退出。
- 操作表达式 主要更新循环变量,在循环体结束后执行。
断点调试
断点调试:在程序的某一行设置一个断点,调试时,程序运行到这一行就会停住,然后你可以一步一步往下调试,调试过程中可以看各个变量当前的值,出错的话,调试到出错的代码行即显示错误,停下。断点调试可以帮助观察程序的运行过程。
断点调试的流程:
1、浏览器中按 F12--> sources -->找到需要调试的文件-->在程序的某一行设置断点
2、Watch: 监视,通过watch添加变量可以监视变量的值的变化。
3、摁下F11,程序单步执行,让程序一行一行的执行,观察watch中变量的值的变化。
二、for循环嵌套
定义:在循环语句中在定义一个循环语句的语法结构。
for (外循环的初始; 外循环的条件; 外循环的操作表达式) {
for (内循环的初始; 内循环的条件; 内循环的操作表达式) {
//需执行的代码;
}
}
举例:
var star = '';
for (var j = 1; j <= 5; j++) {
for (var i = 1; i <= 5; i++) {
star += '*'
}
// 每次满 5个*就加一次换行
star += '\n'
}
console.log(star);
总结:
- 外层循环执行一次,内层循环要执行全部次数。
- for循环是循环条件和数字直接相关的循环。
三、while循环
语法结构:
while (条件表达式) {
// 循环体代码
}
举例:
var num = 1;
while (num <= 10) {
console.log(num + '\n');
num++;
}
- 条件表达式为true,则执行循环体代码,否则退出循环。
- 循环代码执行完结束后,会继续执行条件表达式,它必须有条件否则会出现死循环。
do {
// 循环体代码 - 条件表达式为 true 时重复执行循环体代码
} while(条件表达式);
举例:
do{
var msg= prompt('密码:123456'); //输入密码为123456后循环体结束
}while(msg!=”123456”);
alert(“密码正确”);
- 与while循环方式一致,区别在于它先执行下循环体条件,在判断表达式。
- 循环体至少会执行一次。
四、continue、break
continue :关键字用于立即跳出本次循环,继续下一次循环。
for (var i = 1; i <= 5; i++) {
if (i == 3) {
continue; // 跳出本次循环,跳出的是第3次循环
}
console.log('提示信息:' + i + “\n”);
}
break 关键字用于立即跳出整个循环(循环结束)。
for (var i = 1; i <= 5; i++) {
if (i == 3) {
break; // 跳出整个循环。
}
console.log('提示信息:' + i + “\n”);
}
练习题
1.打印九九乘法表。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var str = "";
for (var i = 1; i <= 9; i++) {
for (var j = 1; j <= i; j++) {
str = str + j + "*" + i + "=" + j * i + "\t";
}
str = str + "\n";
}
console.log(str);
</script>
</body>
</html>
实现效果
2.打印倒三角形案例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var src = '';
for (var i = 1; i < 6; i++) {
for (var j = 1; j < 7 - i; j++) {
src = src + '*';
}
src = src + '\n';
}
console.log(src);
</script>
</body>
</html>
实现效果
3.制作一个简易的计算器,浏览器接收+,-*/、接收两个数,后计算结果。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script>
var first = Number(prompt("请输入第1个数:"));
var symbol = prompt("请输入运算符:");
var end = Number(prompt("请输入第2个数:"));
var sum;
switch (symbol) {
case "+":
sum = first + end;
break;
case "-":
sum = first - end;
break;
case "*":
sum = first * end;
break;
default:
sum = first / end;
}
console.log(sum);
</script>
</body>
</html>
实现效果