4_1：流程控制：分支结构：[ if else ] + [ 三元表达式 ] + [ switch case ]

知识梳理

//1 if else 多用于范围判断 [ 大于等于某个区 区间判断]
//2 switch case 多用于某个固定值的判断 [ 星期几案例 ]
//3 三元表达式 = if else 双分支
//4 只要是表达式 就一定有返回值

一  if分支

1）单分支

if ( 条件表达式 ) {
    //要执行的代码语句
}
//条件表达式为真 执行花括号里面的代码
//条件表达式为假 跳过if 执行下面的代码

2）双分支

//语法结构  if 如果 else 否则 
if ('条件表达式') {
　　//代码语句1
} else {
　　//代码语句2
}
//条件表达式为真 执行代码语句1
//条件表达式为假 执行代码语句2

小demo：判断闰年平年

//算法：能被4整除且不能整除100的为闰年（如2004年就是闰年，1901年不是闰年）或者能够被 400 整除的就是闰年
// 弹出prompt 输入框，让用户输入年份，把这个值取过来保存到变量中
// 使用 if 语句来判断是否是闰年，如果是闰年，就执行 if 大括号里面的输出语句，否则就执行 else里面的输出语句
// 一定要注意里面的且 &&  还有或者 || 的写法，同时注意判断整除的方法是取余为 0
var year = prompt('请您输入年份：');
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
    alert('您输入的年份是闰年');
} else {
    alert('您输入的年份是平年');
}

3）多分支

<script>
        // 1. 多分支语句   就是利用多个条件来选择不同的语句执行 得到不同的结果  多选1 的过程
        // 2. if else if语句是多分支语句
        // 3. 语法规范
        if (条件表达式1) {
            // 语句1;
        } else if (条件表达式2) {
            // 语句2;
        } else if (条件表达式3) {
            // 语句3;
        } else {
            // 最后的语句;
        }
        // 4. 执行思路
        // 如果条件表达式1 满足就执行 语句1 执行完毕后，退出整个if 分支语句  
        // 如果条件表达式1 不满足，则判断条件表达式2  满足的话，执行语句2 以此类推
        // 如果上面的所有条件表达式都不成立，则执行else 里面的语句
        // 5. 注意点
        // (1) 多分支语句还是多选1 最后只能有一个语句执行
        // (2) else if 里面的条件理论上是可以任意多个的
        // (3) else if 中间有个空格了
    </script>

查分数demo：分数值从小到大逻辑

<script>
    //90 a 恭喜学霸
    //80 b 优秀的孩子
    //70 c 中等生 加油
    //60 d 好危险 刚刚及格
    //60以下 e 不及格
    var value = prompt('请输入分数');//获取学生输入的分数值
    //分数从小到大逻辑写
    if (value < 60) {
        alert('e 不及格');
    } else if (value >=60 && value < 70) {
        alert('d 好危险 刚刚及格');
    } else if (value >= 70 && value < 80) {
        alert('c 中等生 加油');
    } else if (value >= 80 && value < 90) {
        alert('b 优秀的孩纸');
    } else if (value >=90 && value <= 100) {
        alert('a 恭喜学霸');
    } else {
        alert('成绩值不合法');
    }
</script>

查分数demo：分数值从大到小逻辑

<script>
    //分数从大到小判断比较合理
    var value = prompt('请输入您的考试成绩');
    if (value > 100) {
        alert('输入的分数值不合法')
    } else if (value >= 90) {
        alert('学霸');
    } else if (value >= 80) { //这里不用写 (>=80 && <=90) 因为大于90的都已经执行了上面的判断条件了
        alert('优秀');
    } else if (value >= 70) {
        alert('需要加油了')
    } else if (value >= 60) {
        alert('刚刚及格')
    } else {
        alert('您竟然不及格');
    }
</script>

二  三元表达式

1）概念

由三元运算符组成的式子 我们称为三元表达式

运算符

//1 一元运算符三个: ++  --  ! [ 加加  减减  取反 ]
//2 三元运算符一个：【? :】
//3 二元运算符：除了一元和三元都是二元。

2）基本语法

条件表达式 ? 表达式1 : 表达式2
//1 条件表达式的值为真 返回表达式1的值
//2 条件表达式的值为假 返回表达式2的值

 3）代码示例

var res = 5 > 4 ? '正确' : '错了';//表达式都有返回值 把返回值赋给一个变量
console.log(res);//正确

小demo：自动补0

//客户输入小于10的数字 前面自动补0 大于10原样输出
var value = prompt('请输入数字');//获取客户输入的值
var res = value < 10 ? 0 + value : value;//三元表达式
alert(res);

三  switch分支

var name = '山西';
switch (name) {
    case '天津':
        alert('我是天津人');
        break;
    case '山西':
        alert('我是山西人');//输出 我是山西人
        break;
    case '北京':
        alert('我是北京人');
        break;
    default :
        alert('您肯定是中国人');
}
//把 表达式的值 和 case里面的 选项值 进行匹配
//如果匹配到就执行case里面的代码
//匹配不到就执行default的代码

使用重点 

1 switch的 条件变量值 和每个case后面的值 进行 全等匹配
2 每个case后面应该书写break

四  if 和 switch 的区别

switch 用于 固定值判断
if else 用于范围判断 [ 大于等于某个范围 ] 更灵活一些
当分支比较少的时候用 if else 效率比较高
分支多的时候用switch 结构清晰 效率比较高