首页 > 技术文章 > Javascript从零基础到精通——分支结构

l3gacy 2020-04-15 08:08 原文

程序执行结构

  • 顺序结构:按照由上到下的顺序一行一行地执行的程序结构

  • 分支结构:根据不同的条件判断来决定程序执行走向的结构(也叫选择结构)

  • 循环结构:需要重复执行同一操作的程序结构称为循环结构。

分支结构

if — 判断逻辑,如果

if(true){
    //会执行的语句
}

if(false){
    //会跳过不执行的语句
}

if(判断条件){ //当if括号中结果为true时执行语句1,否则执行语句2
    //语句1
}else{
    //语句2
}

if(判断条件1){ //当条件1结果为true时执行语句1
    //语句1
}else if(判断条件2){ //当条件1结果为false而且条件2结果为true时执行语句2
    //语句2
}else{ //当条件1条件2结果都为false时执行语句3
    //语句3
}

隐式类型转换

if括号中只需要布尔类型值

if( 0 ){
    alert("你猜我会弹么?");
}

因此,在if判断中,所有的数据类型都会被隐式转换为布尔类型。

注意:0、-0、null、""、false、undefined 或者 NaN在if条件里结果为false

除了+运算符具有两层含义以外,- * /只有数学意义,所以当进行- * /运算的时候默认会将运算符两侧的数据类型隐式转换为数字类型,再进行运算。

var a = 2, b = "2";

if(a == b){
    alert("a和b相等");    // 会弹  
}

if(a === b){
    alert("a和b相等");    // 不会弹  
}

if(1 == true){
    alert("数字1是true");
}


if(a = b){
    alert("a和b相等");
}
//一个等号代表赋值操作,结果为等号右边的值

switch case 多分支语句

switch(语句){  //语句的结果与每一条case内容进行匹配
    case 1:
       alert(1);
           break;
        case 2:
             alert(2);
             break;
        case 3:
            alert(3);
            break;
        default:
            alert(0);
}

注意switch的应用场景(有多个确定值需要判断的时候);
注意case穿透,要加break语句(如果程序没有发现break语句,那么解析器会继续向下解析);

var a = 1;
switch(a){ 
    case 1:
       alert(1);
    case 2:
        alert(2);
    case 3:
        alert(3);
    default:
        alert(0);
}

//每一个alert都会被执行,而且alert会阻断程序进程

分支结构练习

1. 判断一个整数是偶数还是奇数,并输出判断结果

		var a = prompt('请输入一个数字');
        if (a % 2) {
            alert('a是奇数');
        }else{
            alert('a是偶数');
        }

*2. 开发一款软件,根据公式(身高-108)2=体重,可以有10斤左右的浮动。来观察测试者体重是否合适

		var h = prompt('请输入你的身高');
        var a = prompt('请输入你的体重');
        // 标准体重
        var weight = (h - 108) * 2;
        if (weight < a - 10) {
            alert('挺瘦的');
        }else if (weight >= a - 10 && weight <= a + 10) {
            alert('身材不错');
        }else{
            alert('太胖了');
        }

3. 点击切换div颜色

		var box = document.getElementById('box');
        var count = true;
        box.onclick = function () {
            // 如果判断条件只有两个结果,则使用布尔值
            // var count = true; // count不能放在函数内,每点击一次都会赋值为true
            if (count) {
                box.style.backgroundColor = 'green';
                // count = false;
            } else {
                box.style.backgroundColor = 'red';
                // count = true;
            }
            // 每次点击后更改样式,都会取反
            count = !count;

4. 输入年份,计算某一年是否是闰年

		var year = prompt('请输入年份');
        if (year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
            alert(year + '是闰年');
        }else{
            alert(year + '是平年');
        }

5. 输入月份,显示当月的天数

	var year = Number(prompt('输入年份'))
    var month = Number(prompt('输入月份'))
    switch (month) {
      case 1:
      case 3:
      case 5:
      case 7:
      case 8:
      case 10:
      case 12:
        console.log(31)
      break;
      case 4:
      case 6:
      case 9:
      case 11:
        console.log(30)
      break;
      case 2:
        // 判断润平年
        if (year % 4 === 0 && year % 100 != 0 || year % 400 === 0) {
          console.log(29)
        } else {
          console.log(28)
        }
      break;
      default: 
        console.log('请输入1-12')
    }

6. 输入数字,显示星期几,如:输入0,弹出星期日,以此类推(两种方法)

	var num = Number(prompt('请输入0-6的整数'))
    switch (num) {
      case 0: 
        alert('星期天')
      break
      case 1:
        alert('星期一')
      break
      case 2:
        alert('星期二')
      break
      case 3:
        alert('星期三')
      break
      case 4:
        alert('星期四')
      break
      case 5:
        alert('星期五')
      break
      case 6:
        alert('星期六')
      break
      default:
        alert('请输入0-6的整数')
    }

7 设计猜拳游戏

	// 1代表石头 2代表剪刀 3代表 布
    // parseInt(Math.random()*3) + 1  随机生成123的公式
    // 计算机随机生成一个数
    var num = parseInt(Math.random()*3) + 1
    console.log(num) // 作弊,先查看计算机生成的数字是多少
    var myNum = Number(prompt('输入1-3,1代表石头 2代表剪刀 3代表 布'))
    switch (num) {
      case 1:
        // 继续判断玩家的数
        switch (myNum) {
          case 1:
            console.log('平局')
          break
          case 2:
            console.log('输了')
          break
          case 3:
            console.log('赢了')
          break

        }
      break
      case 2:
        // 继续判断玩家的数
        switch (myNum) {
          case 1:
            console.log('赢了')
          break
          case 2:
            console.log('平局')
          break
          case 3:
            console.log('输了')
          break
        }
      break
      case 3:
        // 继续判断玩家的数
        switch (myNum) {
          case 1:
            console.log('输了')
          break
          case 2:
            console.log('赢了')
          break
          case 3:
            console.log('平局')
          break
        }
      break
    }

8. 判断一个三位数是否是水仙花数(如:153 = 1^3 + 5^3 + 3^3,那么153就是水仙花数,水仙花数只有四个: 153,370,371,407)

	var num = Number(prompt('请输入一个三位数'))
    // 取个位:被10除不尽的就是个位
    var gw = num % 10
    // 取十位:先除以10,取整,再对10求余
    var sw = parseInt(num / 10) % 10
    // 取百位:除以100取整
    var bw = parseInt(num / 100)

    if (num === gw*gw*gw + sw*sw*sw + bw*bw*bw) {
      console.log(num + '是水仙花数')
    } else {
      console.log(num + '不是水仙花数')
    }

9. 根据一个数字日期,判断这个日期是这一年的第几天(例如: 20160211,计算后结果为42)

	var month = Number(prompt('请输入一个月份'))
    // 因为要算每个月1号,默认有一天,所以初始值为1
    var days = 1
    // 倒着写,作用就是利用case穿透可以把前面月得的天数全部加起来
    // 输入的数字是几,就从几进入case,然后加上之前月份的天数
    switch (month) {
      case 12:
        // 加上11月得30天
        days += 30
      case 11:
        // 加上10月得31天
        days += 31
      case 10:
        // 加上9月得30天
        days += 30
      case 9:
        // 加上8月得31天
        days += 31
      case 8:
        // 加上7月得31天
        days += 31
      case 7:
        // 加上6月得30天
        days += 30
      case 6:
        // 加上5月得31天
        days += 31
      case 5:
        // 加上4月得30天
        days += 31
      case 4:
        // 加上3月得31天
        days += 31
      case 3:
        if (year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
          days += 29
        } else {
          days += 28
        }
      case 2:
        // 加上1月得总天数31天加上来
        days += 31;
    }
    console.log(days)

推荐阅读