7.JavaScript-流程控制

流程控制

if选择

JavaScript中if选择结构和C语言中一模一样

if(条件表达式1)
{
    语句块1
}else if(条件表达式2){
    语句块2
}else if(条件表达式3){
    语句块3
}else{
    语句块4
}

注意点:
1.对于非布尔类型的数据,会先转换成布尔类型再判断;
2.对于 == / ===判断,将常量写在最前面;

	let num= 10;
    if(5 == num){
      console.log(语句A);
    }
    console.log(语句B);

3.if/else if/else后面的大括号都可以省略,但是省略之后只有紧随其后的语句受到控制;

	if(false){
      console.log(语句A);
      console.log(语句B);
    }//什么都不会显示
    if(false)
      console.log(语句A);
      console.log(语句B);//语句B会显示

4.在JavaScript中分号(;)也是一条语句(空语句);

	if(false){
      console.log(语句A);
      console.log(语句B);
    }//什么都不会显示
	if(false);{
      console.log(语句A);
      console.log(语句B);
    }//语句A和语句B都会显示

5.if选择结构可以嵌套使用;
6.当if选择结构省略大括号时,else if/else会自动和距离最近没有被使用的if匹配.

	if(0)
      if(1)
        console.log("A");
      else//这个else会匹配上面的if(1)
        console.log("B");
     else//这个else会匹配上面的if(0)
      if(1)
        console.log("C");//最终输出C
      else
        console.log("D");

练习1

    //需求:接收用户输入的整数,判断是否为偶数,偶数输出YES,奇数输出NO
    let num = prompt("请输入一个整数");
    //num % 2 ==0 ? alert("YES") : alert("NO");//三目运算符
    if(num % 2 ==0){
      alert("YES");
    }else{
      alert("NO");
    }

注意点:
在企业开发中,如果条件满足之后只有一句代码,那么就使用三目运算符;如果条件满足之后有多条语句需要执行,那么就使用选择结构.
练习2

	//需求:接收用户输入的整数,判断是星期几之后输出
    //alert返回类型是字符串类型
    let str = prompt("请输入一个1-7的整数");
    let day = +str;
    if(1 == day){
      alert("星期一");
    }else if(2 == day){
      alert("星期二");
    }else if(3 == day){
      alert("星期三");
    }else if(4 == day){
      alert("星期四");
    }else if(5 == day){
      alert("星期五");
    }else if(6 == day){
      alert("星期六");
    }else if(7 == day){
      alert("星期日");
    }else{
      alert("回到火星去")
    }

练习3

//需求:接收用户输入的整数,判断是什么季节之后输出(3/4/5春季,6/7/8夏季,9/10/11秋季,12/1/2冬季)
    /*let str = prompt("请输入一个1-12的整数")
    let num = +str;
    if(3 == num || 4 == num || 5 == num){
      alert("春季");
    }else if(6 == num || 7 == num || 8 == num){
      alert("夏季");
    }else if(9 == num || 10 == num || 11 == num){
      alert("秋季");
    }else if(12 == num || 1 == num || 2 == num){
      alert("冬季");
    }else{
      alert("输入错误")
    }*/
    let str = prompt("请输入一个1-12的整数")
    let num = +str;
    if (num <=0 || num > 12){
      alert("回到火星去");
    }else if(3 == num || 4 == num || 5 == num){
      alert("春季");
    }else if(6 == num || 7 == num || 8 == num){
      alert("夏季");
    }else if(9 == num || 10 == num || 11 == num){
      alert("秋季");
    }else{
      alert("冬季");
    }

练习4:排序

//需求:有三个变量a,b,c,要求升序排序后输出
    //排序前 a = 5, b = 3, c = 4
    //排序后 a = 3, b = 4, c = 5
    let a = 5,b = 3,c = 4;
    let t;
    console.log(a,b,c);
    //1.利用a和b进行比较,如果a>b,就交换a和b中保存的数据
    if(a > b){
      t = a;
      a = b;
      b = t;
    }
    //2.利用b和c进行比较,如果b>c,就交换b和c中保存的数据
    if(b > c){
      t = b;
      b = c;
      c = t;
    }
    //3.再利用a和b进行比较,如果a>b,就交换a和b中保存的数据
    if(a > b){
      t = a;
      a = b;
      b = t;
    }
    console.log(a,b,c);

Switch选择

JavaScript中Switch选择结构和C语言几乎一样

switch(条件表达式){
  case 表达式:
      语句1;
      break;
  case 表达式:
      语句2; 
      break;
  case 表达式n:
      语句n;
      break;
  default:
      语句n+1;
      break;
}

注意点:

• case全等于问题:
  JavaScript中case判断是否相等时是全等于(===),而不是等于(==),也就是说既会判断类型是否相等又会判断值是否相等;

var str = "123";
switch (str){
    case 123:
        console.log("123数字");
        break;
    case "123":
        console.log("123字符串"); // 输出123字符串
        break;
    default:
        console.log("default");
        break;
}

• 和C语言不同的是, JavaScript中case后可以是常量也可以是变量;

var num = 120;
switch (120){
    case num: // 这里可以是变量
        console.log("120"); // 输出120
        break;
    case 110: // 这里可以是常量
        console.log("110");
        break;
    default:
        console.log("default");
        break;
}

• case后面可以使常量也可以是变量还可以是表达式;

let num = 123;
switch (123){
    case 123: // 这里可以是常量
        console.log("数值的123");
        break;
    case num: // 这里可以是变量
        console.log("数值的123");
        break;
    case 100 + 23: // 这里可以是表达式
        console.log("数值的123");
        break;
}

• break的作用是立刻结束整个switch语句;
  在switch语句中一旦case或者default被匹配,那么其他的case和default都会失效

var num = 1;
switch (num){
    case 1:
        console.log("1");
        //break;
    case 2:
        console.log("2"); 
        break;
    default:
        console.log("default");
        break;
}

• default不一定要写在最后;
  switch中的default无论放到什么位置,都会等到所有的case都不匹配再执行

• 和if/else中的else一样,default也可以省略.

练习:

<!--要求用户输入一个分数,根据输入的分数输出对应的等级
    A 90-100
    B 80-89
    C 70-79
    D 60-69
    E 0-59-->
    //1.接受用户输入的分数
    let str = prompt("请输入一个0-100的数");
    // let score = +str;
    let num = +str;
    let score = parseInt(num / 10);
    //2.判断用户输入分数的范围,根据范围输出等级
    switch(score){
      case 10:
      case  9:
        alert("A");
        break;
      case 8:
        alert("B");
        break;
      case 7:
        alert("C");
        break;
      case 6:
        alert("D");
        break;
      case 5:
      case 4:
      case 3:
      case 2:
      case 1:
      case 0:
        alert("E");
        break;
      default:
        alert("回到火星去");
        break ;
    }

while循环

JavaScript中while循环和C语言中一模一样

while ( 条件表达式 ) {
     语句1;
     语句2;
     ....
 }

什么是死循环?

条件表达式永远为真的循环结构我们称之为死循环.

什么是循环体?

循环结构后面的{}我们称之为循环体.

书写循环结构代码的规则

1.先写上循环结构的代码;
2.将需要重复执行的代码拷贝到{}中;
3.在()中指定循环结束的条件.

练习1:

//需求:打印1-100是7的倍数,并统计个数
    let num = 1;
    let count = 0;
    while(num <= 100){
        if(num % 7 == 0){
            console.log(num);
            count++;
        }
        num++;
    }
    console.log(count);

练习2:

//提示用户输入一个正整数n,计算1+2+3+...+n的和
    let n = prompt("请输入一个正整数n");
    let sum = 0;
    let num = 1;
    while(num <= n){
      sum = sum + num;
      num++;
    }
    console.log(sum);

do-while循环

JavaScript中dowhile循环和C语言中一模一样

 do {
     语句1;
     语句2;
     ....
 } while ( 条件 );

while与do-while的区别

		//需求:要求用户输入密码,判断输入密码是否正确(假设密码是123456)
        //如果正确,输出欢迎回来
        //如果不正确,要求用户重新输入
        let pwd = prompt("请输入密码");
        while(pwd !=="123456"){
            pwd = prompt("请输入密码");
        }
        alert("欢迎回来");

		let pwd = -1;
        do{
            pwd = prompt("请输入密码");
        }while(pwd !=="123456");
        alert("欢迎回来");

在企业开发中,大部分情况下while和do-while循环是可以互换的;
在企业开发中,如果循环体的代码无论如何都需要先执行一次,那么建议使用do-while循环;
其他情况都建议使用while循环

for循环

JavaScript中for循环和C语言中一模一样

for(①初始化表达式；②循环条件表达式；④循环后操作表达式)
{
    ③执行语句；
}

for循环的执行流程:
1.首先会执行初始化表达式,并且只会执行一次;
2.判断条件表达式是否为真,如果为真就执行循环体;
3.执行完循环体就会执行循环后增量表达式;
4.重复第二点和第三点,直到条件不为真为止.

在企业开发中能使用for循环就使用for循环.

注意点

1.while循环不能省略条件表达式,for循环是可以省略条件表达式的,默认就是真.

循环嵌套

练习1

<script>
    /*
    需求:在界面中输出如下图形
    *****
    ****
    ***
    **
    *

     */
    //规律:如果三角形尖尖朝下,那么只需要修改内部循环的初始化表达式为外循环初始表达式的变量即可
    for (let i = 0; i < 5; i++){
      for(let j = i; j < 5; j++){
        document.write("*");
      }
      document.write("<br>");
    }
  </script>

练习2

	/*
    需求:在界面中输出如下图形
    *
    **
    ***
    ****
    *****
     */

    for (let i = 0; i < 5; i++){
        for(let j = 0; j <= i; j++){
            document.write("*");
        }
        document.write("<br>");
    }

三大跳转

JavaScript中没有提供C语言中的goto语句, 但是其它的三大跳转和C语言中一模一样

• return
  可以立即结束所在函数
• break
  可以立即跳出所在switch语句或循环语句, 离开作用范围没有意义
  注意点:
  后面不能编写代码,因为执行不到;
• continue
  只能立即跳出所在循环语句, 离开作用范围没有意义.在循环结构中continue关键字的作用就是跳过本次循环,进入下一次循环
  注意点:
  和break一样,后面不能编写代码,因为执行不到;
  和break一样,