对于JS流程控制，与C语言的流程控制如出一辙。白龙网从顺序结构、分支结构、循环结构三个层面展开复习。顺序结构不用多数，按照先后顺序执行即可。宏观上说，分支结构有if分支、三元运算、switch语句等3种形式，重点是if分支语句，它又细分为单分支、双重分支和多重分支语句。循环语句就比较复杂一些，分别为for循环、while循环、do while循环，其中for循环又细分为单for循环，双重for循环，一般两重循环就能满足大部分需求。
1、顺序结构
1、顺序结构
按照代码的先后顺序，依次执行。
2、分支结构
根据不同的条件，执行不同的路径的代码，得到不同的结果。不管是单分支语句，还是多分支、多分支语句，执行结果只有一个。另外，else与if之间有一个空格，如果else表示结束，只有if后面可以跟花括号。
（1）if分支类型
①if单分支语句
<script>
if (条件表达式) {
//语句，当条件表达式为真时，执行花括号内语句；当条件表达式为假时，执行if后面的语句
}
</script>
案例：设置条件，只允许18岁以上的成年人可以访问网站。
<script>
var age = prompt('请输入您的年龄');
if (age >= 18) {
//
alert('欢迎访问白龙网');
}
</script>
②if双分支语句
<script>
if (条件表达式) {
//语句1，当条件表达式为真时，执行花括号内语句1；
} else {
//语句2，当条件表达式为假时，执行语句2；需要特别注意的是，else后面只能加花括号，不能加圆括号
}
</script>
案例1：年满18岁，方可上网
<script>
var age = prompt('请输入您的年龄');
if (age >= 18) {
//
alert('欢迎访问白龙网');
} else {
alert('未满18岁，禁止上网')
}
</script>
案例2：判断闰年、平年
<script>
var year = prompt('输入年份，查看闰年、平年');
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
alert('您输入的年份' + year +' 是闰年');
} else {
alert('您输入的年份' + year + '是平年');
}
</script>
案例3：中奖有奖，否则无奖
<script>
var prize = prompt('请输入中奖者姓名：');
if (prize == '刘德华') {
alert('恭喜您，中奖5元');
} else {
alert('很遗憾，您没有中奖，继续加油哦');
}
</script>
③if多分支语句
<script>
if (条件表达式) {
//语句1，当条件表达式为真时，执行花括号内语句1；
} else if{
//语句2，当条件表达式为假时，执行语句2；需要特别注意的是，else后面只能加花括号，不能加圆括号
} else if {
//语句3
} else {
//语句n，如果上面的条件都不满足，就执行最后一个
}
</script>
案例：根据学生成绩，打印对应评级
<script>
var score = prompt('请输入您的分数：');
if(score > 100) {
alert('满分100分，请输入有效分数');
} else if(score >= 90) {
alert('您的评分是：A');
} else if(score >=80) {
alert('您的评分是：B');
} else if(score >=70) {
alert('您的评分是：C');
} else if(score >= 60) {
alert('您的评分是：D');
} else if(score >= 0) {
alert('您的评分是：F');
} else if(score < 0) {
alert('请输入0~100之间的分数');
}
</script>
（2）三元表达式
三元表达式类似于双重分支语句，他是由三元运算符（?:）组成的式子
<script>
var num = 10;
var result = num > 6 ? '您说的对' : '不对';
console.log(result);//您说的对
</script>
案例：输入一个0~59之间的数字，如果小于10，就在数字前加个0，否则就正常输出这个数字。
<script>
var time = prompt('请输入0~59之间的数字')
var result = time < 10 ? '0' + time : time;
alert(result);
</script>
（3）switch语句
是多分支语句，也是多选一的语句，主要针对变量设置特定值。执行过程中，判断表达式的值是否与case后面的值匹配，如果匹配成功，则执行对应语句；否则就执行默认值。
表达式与CASE的值是全等，即===；baeak不能省略，如果没有break，当前语句不会退出switch，语句会按照顺序全部执行，直到遇到break；
switch(表达式) {
case value1: 语句1;break;
case value2: 语句2;break;
…………………………………………
default: 语句;
}
案例：表达式3与case3匹配，故而打印3。
<script>
var num = prompt('请输入数值：');
switch(parseInt(num)) {
case 1:
console.log('1');
break;
case 2:
console.log('2');
break;
case 3:
console.log('3');
break;
default:
console.log('没有查询到对应内容');
}
</script>
案例：查询水果的价格
<script>
var fruit = prompt('请输入水果名称：');
switch(fruit) {
case '苹果':
console.log(fruit + '的价格是10元/斤');
break;
case '香蕉':
console.log('香蕉的价格是2元/斤');
break;
default:
console.log('我们没有这种水果');
}
</script>
一般来说，switch case 语句与if else语句可以相互通用。
当case值为固定值时，建议使用switch，当表达式为判断时，建议用if else;
switch判断表达式后，直接跳转到case后面的语句，效率更高；if需要多次判断，效率相对低一些。
另外，当分支较少时，if语句比switch语句效率高，当分支较多时，switch语句比if语句效率高些。
案例：输入时间，显示问候语
<script>
var time = prompt('请输入时间点：');
if (time == '12点') {
alert('中午好');
} else if(time == '18点') {
alert('傍晚好');
} else {
alert('晚上好');
}
</script>
案例：比较大小并打印
<script>
var num1 = prompt('请输入一个数：');
var num2 =prompt('请再输入一个数：');
if (num1 > num2) {
alert(num1);
} else {
alert(num2);
}
</script>
案例：判断奇偶数并打印
<script>
var num = prompt('请输入一个数：');
if (num % 2 == 0) {
alert(num + '是一个偶数');
} else if (num % 2 != 0) {
alert(num + '是一个奇数')
}
</script>
案例：输入数字，显示对应星期
<script>
var num = prompt('请输入1！7的数字：');
switch(num) {
case '1':
alert('星期一');
break;
case '2':
alert('星期二');
break;
case '3':
alert('星期三');
break;
case '4':
alert('星期四');
break;
case '5':
alert('星期五');
break;
case '6':
alert('星期六');
break;
case '7':
alert('星期七');
break;
default:
alert('你输入的内容不合法')
}
</script>
案例： 根据钱的金额，提醒用户干点啥
<script>
var money = prompt('您猜班长有多少钱：');
if (money >= 2000) {
console.log('请大家吃西餐');
} else if (money >= 1500) {
console.log('请大家吃快餐');
} else if (money >= 1000) {
console.log('请大家喝饮料');
} else if(money >=500) {
console.log('请大家吃棒棒糖');
} else {
console.log('班长下次要把钱带够哦');
}
</script>
3、循环结构
循环的目的，是重复执行某些语句，通常跟计数有关。重复执行的部分叫循环体，是否重复执行，取决于循环条件，由循环终止条件和循环体组成的部分叫循环语句。
(1)for循环
①for循环
❶语法结构
for(初始化变量;条件表达式;操作表达式) {
//循环休
}
初始化变量：声明一个变量并赋值，这个变量通常作为计数器；
条件表达式：决定终止的条件；
操作表达式：主要是用来更新变量/计数器。
<script>
for (var i = 1; i < 5; i++) {
console.log('*');
}
</script>
❷执行过程
A.首先执行初始化变量，这个步骤只执行一次；
B.然后执行条件表达式，满足则继续往下执行；
C.其次执行循环体
D.接着执行操作表达式，此时先返回表达式原值i++=1,再加1i=2；
E.然后在条件表达式、循环体、操作表达式之间一直循环，直到条件终止。
❸断点调试
使用断点调试功能可以监控程序执行的整个过程与每个细节。使用方法是，检查->sources->目标代码左右数字上点击->刷新（就设置了断点）->下一步（查看程序执行的每一步）。
如果要取消断点，就在代码代码的数字上单击一下并刷新即可。
另外，可以在watch中添加变量，用来观察变量的变化。
❹循环执行相同的代码
设置一个变量，让用户控制循环打印相同内容的次数
<script>
var num = prompt('请输入循环执行的次数：');
for (var i = 1; i <= num; i++) {
console.log('白龙网');
}
</script>
❺循环执行不同的代码
案例：仅仅for循环执行不同的代码
<script>
for(var i = 1; i <= 100; i++) {
console.log('白龙网已经上线' + i + '年了');
}
</script>
案例：嵌套分支语句循环执行不同的代码，这里要注意的是条件表达式中要用比较运算符 ==
<script>
for(var i = 1; i <= 100; i++) {
if(i == 1) {
console.log('白龙网刚刚上线，有待于继续更新');
} else if (i == 100) {
console.log('哇，白龙网已经发展成为100年网站了');
} else {
console.log('白龙网是个' + i + '年的好网站');
}
}
</script>
❻重复执行某些操作：计算1~100之间所有数的和与所有数的平均值
<script>
var sum = 0;
for (var i = 1; i <= 100; i++) {
sum += i;
}
console.log('总和=' + sum);
console.log('平均值=' + sum/100);
</script>
案例a：求出1~100之间所有偶数之和与奇数之和
<script>
var even = 0,odd = 0,sum = 0;
for(var i = 0; i <= 100; i++) {
if(i % 2 ==0) {
even += i;
} else {
odd += i;
}
}
sum = even + odd;
console.log('1-100之间的偶数之和是：' + even);
console.log('1-100之间的奇数之和是：' + odd);
console.log('1-100之间的奇偶数之和是：' + sum);
</script>
案例b：1-100之间能被3整除的数之和
<script>
var sum = 0;
for (var i = 1; i <= 100; i++) {
if (i % 3 == 0){
sum += i;
}
}
console.log('1-100之间能被3整除的数之和是：' + sum);
</script>
案例c：根据班级人数，输入学生成绩，并打印成绩总和，求出成绩平均值，这里的技巧在于输入一个人数用一个语句表示，而输入多个成绩则用循环来写，另外，prompt接收的数据是字符型，要转换为数字型。
<script>
var num = prompt('请输入班级人数：');
var sum = 0;
var average = 0;
for (var i = 1; i <= num; i++) {
var score = prompt('请输入第' + i + '个成绩');
sum = sum +parseFloat(score);
}
// alert('成绩总和为：' + sum);
average = sum/num;
console.log('成绩之各为：' + sum);
console.log('平均成绩为：' + average);
</script>
案例d：打印一行5个五角星，这里两个难点：一是定义一个空字符串，单引号内一定要加空格；二是使用追加、拼接字符串的的方法把星星放到同一行。
<script>
var str = ' ';
for (var i = 1; i <= 6; i++) {
str = str + '★';
}
console.log(str);
</script>
②双重for循环
双重for循环，是两个for循环嵌套在一块，内层循环本质上是一个语句。具体执行而言，外层循环一次，内层全部循环。如下例：
<script>
for (var i = 1; i <= 3; i++) {
console.log('A这是外层第' + i + '次循环');
for (var j = 1; j <= 3; j++) {
console.log('这是内层第' + j + '次循环');
}
}
</script>
案例：打印5行5列的星星，有3个点需要注意，一是内循环负责一行星星的打印，二是外循环负责打印5行星星，即：行数，并且每打印一行，就输出一个回车换行。
<script>
var str = '';
for (var i = 1; i <= 3; i++) {
for (var j = 1; j <= 3; j++) {
str += '★';
}
str += ' ';
}
console.log(str);
</script>
案例：倒三角形打印，循环负责行数，内循环负责一行打印的星星内容
<script>
var str = '';
for (var i = 1; i <= 10; i++) {
for (var j = i; j <= 10; j++) {
str += '★';
}
str += ' ';
}
console.log(str);
</script>
案例：打印正三角形
<script>
var str = '';
for (var i = 1; i <= 10; i++) {
for (var j = 11 - i; j <= 10; j++) {
str += '★';
}
str += ' ';
}
console.log(str);
</script>
案例：乘法口决表，这个算法的核心是每一行元素个数小于等于行号，即：j<=i；然后根据1X1=1这个算式，结合其与行号、元素数的关系，转换成代码即可。
可以简单的理解成，先打印一个三角形的图片，然后把每行中元素修改成公式即可。
<script>
var str = '';
for (var i = 1; i <= 9; i++) {
for (var j = 1; j <= i; j++) {
// 1 X 2 =2
str += j + 'x' + i + '=' + i*j + ' ';
}
str += ' ';
}
console.log(str);
</script>
(2)while循环
while语句，其实与for循环一样，有初始化变量，有判断表达式（为真时，执行循环休，为假时，退出循环休），计数器。如果没有计数器，会进入死循环。
<script>
var num = 1;
while (num <= 100) {
console.log(num);
num++;
}
</script>
案例：不满足条件，会一直执行下去
<script>
var message = prompt('');
while(message !== '我爱你') {
message = prompt('你爱我吗？');
}
alert('我也爱你哟');
</script>
(3)do while循环
do while与while一样，都要有初始变量，计数器，条件表达式；与while不同的是，do while是先执行一次循环体之后，再判断条件，当条件不满足时，就退出循环。
<script>
var i = 1;
do {
console.log(i);
i++;
} while (i <= 100);
</script>
三个循环语句是可以相互替换使用的；与次数有关，一般用for；更复杂的判断可以使用while或者do while。而while与do while的主要区别是谁先执行的事儿。
（4）continue与break
①continue 退出当前循环，直接跳转到++，继续下一轮循环，如下例，共执行4次，而第3次没有打印
<script>
for (var i =1; i <= 5; i++) {
if (i == 3) {
continue;
}
console.log('这是第' + i + '次输出');
}
</script>
②break 退出整个循环，剩下的程序不再执行了，如下例，程序仅执行了2次
<script>
for (var i =1; i <= 5; i++) {
if (i == 3) {
break;
}
console.log('这是第' + i + '次输出');
}
</script>
案例：求1~100内非7倍数的数之和
<script>
var sum = 0;
for (var i = 1; i <= 100; i++) {
while (i % 7 != 0) {
sum += i;
i++;
}
}
console.log(sum);
</script>
案例：判断输入的用户名、密码是否正确，正确则弹出登陆成功，错误则要求一直输入用户名，密码。
<script>
var user = prompt('请输入用户名：');
var psd = prompt('请输入密码：');
while (user == 'admin' && psd == '123456') {
alert('登陆成功');
break;
}
while (user != 'admin' && psd != '123456') {
user = prompt('请输入用户名：');
psd = prompt('请输入密码：');
}
</script>
案例：模拟简单的ATM机
<script>
num = prompt('存钱请输入1 取钱请输入2 查询请输入3 退出请输入4');
var money = 100;
var save = 0;
switch (num) {
case '1':
save = prompt('请输入存钱金额：');
money += parseFloat(save);
alert('您存入金额是' + save + '元 您帐户余额是' + money + '元');
prompt('存钱请输入1 取钱请输入2 查询请输入3 退出请输入4');
break;
case '2':
draw = prompt('请输入取钱金额：');
if (parseFloat(draw) > money) {
prompt('余额不足，请重新输入 取钱请输入1 存钱请输入2 查询请输入3 退出请输入4');
} else {
money -= parseFloat(draw);
alert('取款成功，帐户余额' + money + '元');
prompt('存钱请输入1 取钱请输入2 查询请输入3 退出请输入4');
}
break;
case '3':
alert('当前余额为' +money + '元');
break;
prompt('存钱请输入1 取钱请输入2 查询请输入3 退出请输入4');
case '4':
alert('欢迎下次光临');
break;
}
</script>