流程控制是编程中的一个重要概念，它决定了代码的执行顺序。在运行JavaScript程序代码时，如果没有特定的语法结构，程序会按照代码的先后顺序，从头到尾、从上到下依次执行每一条JavaScript代码，不重复执行任何代码，也不跳过任何代码。JavaScript主要通过条件语句和循环语句来控制代码的执行流程。
条件语句：根据条件判断的结果选择不同的代码路径执行，如if、if...else和switch语句。
循环语句：在一定条件下重复执行某段代码，如for、while、do...while和for...in循环。
1、JavaScript中的条件语句
JavaScript中的条件语句主要包括if、if...else和switch语句。
（1）if语句
if语句用于在条件为true（真）时执行一段代码。语法为：if(条件) { 代码块; }。例如：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>if条件语句示例</title>
</head>
<body>
<body>
<script>
let age = 20;
if (age >= 18) {
console.log("已成年"); // 输出 已成年
}
let score = 50;
if (score >= 60) {
console.log("及格"); // 条件为false，未执行代码块
}
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
已成年
上面的例子中，“score=50”小于60，所以条件为false，导致未执行代码块中的代码。
（2）if...else语句
if...else语句用于在条件为true（真）时执行一段代码，否则执行另一段代码。语法为if (条件) { 代码块1; } else { 代码块2; }。例如：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>if...else条件语句示例</title>
</head>
<body>
<body>
<script>
let age = 15;
if (age >= 18) {
console.log("已成年"); // 条件为false，未执行代码块
} else {
console.log("未成年"); // 输出 未成年
}
let score = 70;
if (score >= 60) {
console.log("及格"); // 输出 及格
} else {
console.log("不及格"); // 条件为true，未执行代码块
}
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
未成年
及格
上面的例子中，“age=15”小于18，所以条件为false，导致未执行第一个代码块中的代码，转而执行第二个代码块中的代码。
“if...else语句”常用于对条件进行判断，并根据判断结果执行不同的代码块。但是，有些情况下，需要对多个条件进行判断，这时就需要使用“else if”语句了。“else if”语句不能单独出现，必须跟在“if”语句后边。“else if”可以理解为“否则如果”。例如：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>if...else条件语句示例</title>
</head>
<body>
<body>
<script>
let score = 75;
if (score >= 90) {
console.log("优秀");
} else if (score >= 80) {
console.log("良好");
} else if (score >= 60) {
console.log("及格");
} else {
console.log("不及格");
}
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
及格
上面的例子中，代码执行了第二个“else if”后面的语句。从运行结果可以看出，“else if”语句的执行逻辑是逐个检查条件，一旦找到“a >= 60”为“true”的条件，就执行对应的代码块，并跳过其他条件内容。
（3）switch语句
switch语句用于根据表达式的值选择执行不同的代码块。switch语句语法如下所示：
switch(表达式){
case 值1:
代码1;
break;
case 值2:
代码2;
break;
case 值3:
代码31;
break;
case 值4:
代码4;
break;
......
default:
代码N;
}
switch语句中表达式的值会与结构中的case的值进行比较，如果完全匹配，则该case关联的代码会被执行，并在遇到break就停止，且整个switch语句代码执行结束。如果所有的case的值都和表达式的值不匹配 ，则执行default里面的代码。注意，执行case里面的代码时，如果没有break语句，则继续执行下一个case中的语句。
switch语句示例代码如下：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>switch语句示例</title>
</head>
<body>
<body>
<script>
let day = 5;
switch (day) {
case 1:
console.log("星期一");
break;
case 2:
console.log("星期二");
break;
case 3:
console.log("星期三");
break;
case 4:
console.log("星期四");
break;
case 5:
console.log("星期五");
break;
case 6:
console.log("星期六");
break;
case 7:
console.log("星期日");
break;
default:
console.log("无效日期");
}
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
星期五
上面的例子中，day的值匹配第5个case的值，该第5个case后面关联的代码被执行，并遇到break停止，导致整个switch语句代码执行结束。
2、JavaScript中的循环语句
JavaScript中的循环语句用于在一定条件下重复执行某段代码。JavaScript中常用的循环语句有for、while、do...while和for...in循环。
（1）for循环
for循环用于重复执行一段代码固定次数。语法为for(初始化变量;条件表达式;操作表达式){代码块}。for循环语法解析如下：
初始化变量：通常用于初始化一个计数器，可以使用let关键字声明一个新的变量，这个变量用来帮助我们记录循环次数。
条件表达式：用于确定每一次循环是否能被执行，如果结果为true就继续循环，否则就退出循环。
操作表达式：用于确定每一次循环是否能被执行，如果结果是true就继续执行代码块中的代码，否则就退出循环。
switch语句示例代码如下：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>for循环示例</title>
</head>
<body>
<body>
<script>
let sum = 0
for (let i = 1; i <= 5; i++) {
console.log(i) // 每一次循环输出不同的结果
sum += i // 相当于：sum = sum + i
}
console.log(sum) // 5次循环结果相加，得到结果为：25
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
1
2
3
4
5
25
上面的例子中，变量的初始化时最先开始执行的，而且在整个循环中只执行一次。接着判断条件是否成立，如果条件表达式为true，则执行循环中的内容，并进入到操作表达式，对计数器进行更新。计算器更新完成后，重新回到条件表达式，再次开始循环，直到循环5次后，条件表达式为false，结束循环。
（2）while循环
while循环用于在条件为true（真）时重复执行代码块。只要指定条件为true，循环就可以一直执行代码块。语法为while (循环条件) {循环代码; }。例如：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>while循环示例</title>
</head>
<body>
<body>
<script>
let count = 0;
while (count <= 5) {
console.log(count);
count++;
}
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
0
1
2
3
4
5
上面的例子中可以看出，while循环语句的特点是先判断后执行。当条件为true时，就执行JavaScript语句；当count大于5时，条件为false时，就退出循环。
（3）do...while循环
do...while循环：与while循环类似，但至少执行一次代码块，然后检查条件。语法为do { 循环体代码; } while (条件表达式);。例如：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>do...while循环示例</title>
</head>
<body>
<body>
<script>
let count = 0;
do {
console.log(count);
count++;
} while (count < 5);
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
0
1
2
3
4
上面的例子中先执行一次循环体中的代码，再执行条件表达式，如果为true，则继续执行循环体中的代码，如果为false，则退出循环。注意，do...while循环是每次循环后判断条件表达式。
（4）for...in循环
for...in循环：常用于对数组或者对象的属性进行循环。语法为for(变量 in 对象)。例如：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>for...in循环示例</title>
</head>
<body>
<body>
<script>
let person = {name: "张三", age: 25, city: "上海"};
for (let key in person) {
console.log(key + ": " + person[key]);
}
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
name: 张三
age: 25
city: 上海
上面的例子中，我们遍历person对象的属性，并输出每个属性的键值对。
（5）中断循环
在JavaScript中，有两种特殊的语句用于在循环内部终止循环：break 和continue。
break：立即退出整个循环。
continue：只退出当前循环，根据判断条件来决定是否进入下一次循环。（当前循环中continue之后的代码不会被执行）
continue语句代码示例如下：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>continue中断循环示例</title>
</head>
<body>
<body>
<script>
for(var i = 0; i < 5; i++){
if(i == 3){
continue; // 结束本次循环，continue之后的代码不会被执行，直接进入下一次循环
}
console.log(i); // 打印0到4，但不会打印3
};
</script>
</body>
</html>
通过浏览器执行以上代码，我们按F12键打开浏览器的控制台，可以看到输出结果为：
0
1
2
4
上面的例子中，for循环遇到“i=3”时退出循环体，直接进入下一次循环，所以输出结果中不包含“3”。
3、条件语句和循环语句的实际应用
程序开发中经常会用到条件语句和循环语句，例如，用户登录时，需判断用户输人的用户名和密码是否全部正确，进而决定用户是否能够成功登录。例如：
动手练一练：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>条件语句和循环语句的实际应用示例</title>
</head>
<body>
<body>
<script>
for(var i = 1; i <= 3; i++){
var name = prompt('请输入用户名：');
var pwd = prompt('请输入密码：');
if(name == 'admin' && pwd == '123'){
alert('登录成功');
break; // 结束整个循环
} else {
alert('登录失败，还剩下' + (3 - i) + '次机会');
}
}
</script>
</body>
</html>
通过浏览器执行以上代码，在弹出的对话框中要求输入用户名和密码，如果用户名和密码分别为（admin，123）则提示登录成功，否则提示还剩余几次输入机会，如果3次都输入错误，则提示“登录失败”。