JavaScript 流程控制

JavaScript 流程控制

1.基本概念

流程控制就是通过控制代码的执行顺序来实现我们需要的功能
流程控制有顺序结构，分支结构和循环结构

2.顺序结构

顺序结构是程序中最简单，最基本的流程控制，没有特定的语法结构，程序会按照代码的先后顺序，依次执行

3.分支结构

从上到下执行代码的过程中，根据不同的条件，执行不同的路径代码，从而得到不同的结果
两种分支结构语句：if语句和switch语句

1.if分支语句

语法:
if(条件表达式){
条件成立执行的代码语句；
}else{
条件不成立执行的代码语句
}

demo–弹出一个输入框，要求用户输入年龄，如果年龄大于18，允许进入网吧

var age = prompt('请输入您的年龄：');
if(age >= 18){
     alert('您可以进入网吧')
 }else{
     alert('未成年不能进入网吧，回家好好学习吧宝')
}

2.switch分支语句

多分支语句，基于不同的条件来执行不同的代码。当要针对变量设置一系列特定值的选项时可以用switch
执行思路：利用表达式的值 和 case后面的选项值相匹配，如果匹配上，就执行case里面的语句，如果都没匹配上那么就执行default里面的语句
语法

switch(表达式){
    case value1:
        执行语句1;
        break;
    case value2:
        执行语句2;
        break
    ...
    default:
        执行最后的语句;
}

switch注意事项：

1. 在开发里面，表达式经常写成变量
2. 表达式的值和 case 里面的值 相匹配的时候是全等，也就是必须值和数据类型一致
3. 如果当前的case里面没有break 则不会退出switch 是继续执行下一个case

demo – 用户在弹出框里输入一个水果，如果有就弹出该水果的价格，如果没有就弹出 没有此水果

var fruitName = prompt('请输入你要查询价格的水果名称：')
switch(fruitName){
    case '苹果':
        alert('苹果价格：￥20元/斤');
        break;
    case '香蕉':
        alert('香蕉价格：￥15元/斤');
        break; 
    case '凤梨':
        alert('凤梨价格：￥25元/斤');
        break; 
    default:
        alert('没有此水果');   
}

switch语句和if else if 语句的区别：

• 一般情况下，两者可以相互替换
• switch 语句通常处理确定值得情况，if else if 通常处理范围值
• switch 进行条件判断后直接跳转到相应的case语句，效率更高，if else if 语句有多少种条件就要判断多少次
• 分支较少时，if else if语句的执行效率比switch高
• 分支较多时，switch语句的执行效率较高，且结构更清晰

3.三元表达式

三元表达式：由三元运算符组成的式子
条件表达式 ？ 表达式1 ： 表达式2

demo :数字补0,如果数字小于10，则在前面补0，比如01,09，如果数字大于10，则不需要补，比如20

//注意点，prompt用户输入内容皆规定为字符串，所以比较需要强制装换
var num = prompt('请输入数字：')
parseInt(num) < 10 ? num = 0 + num: num;
alert(num);

4.循环结构

1.基本概念

循环的目的：可以重复的执行一些代码

2.for循环

在程序中，一组被重复执行的代码叫做循环体，能否继续重复执行，取决于循环的终止条件，由循环体即循环的终止条件组成的语句被称为循环语句
语法结构

for循环主要用于把某些代码循环若干次，通常和计数有关系

for(初始条件；条件表达式；操作表达式){
	循环体；
}

断点调试：

demo1 – 累加求和

 var sum = 0;
var num = prompt('请输入你要累加的最后一位数：')
for(var i=1; i<=parseInt(num); i++){
    sum +=  i;
}
alert(sum);

demo2 – 双重for循环完成乘法表

var str = '';
for(var i=1; i<=9;  i++){
    for(var j=1; j<=i; j++){
        str += j+'*'+i+'='+i*j; 
    }
    str += '\n'
}
console.log(str);

3.while循环和do while循环

while循环：
while循环语句在表达式为真的前提下，循环执行指定的一段代码，直到表达式不为真时结束
语法结构

while(条件表达式){
   循环体代码;
}

执行思路：

• 先执行条件表达式，结果为true，则执行循环体代码，否者退出循环，执行后面的代码
• 循环体代码执行完毕后，程序会继续判断执行条件表达式，如果结果为true,则会继续执行循环体，直到循环条件为false时，整个循环过程才会结束

do while 循环
do…while语句是while语句的一个变体。该循环会先执行一次代码块，然后对条件表达式进行判断，如果条件为真，就会重复执行循环体，否者退出循环
语法结构

do{
    循环体代码;
} while(条件表达式)

4. break 和continue

• continue 关键字
  用于立即跳出本次循环，进行下一次循环
• break 关键字
  用于立即跳出整个循环（循环结束）