Day3-if语句

Posted 2020-09-05 行走de猫

3.1 if语句初步

如果……那么……否则……

if就是英语“如果”的意思，else就是“否则”。

举个例子：

1           if(明天不下雨){ 2                  我就出去玩； 3           }else{ 4                  我就在家写作业; 5           }

 

公式：

1           if(条件表达式){ 2                  条件为真的时候做的事情 3           }else{ 4                  条件为假的时候做的事情 5           }

称为if语句结构体。

 

一个程序：

1                  <script type="text/javascript"> 2                         var a = 10;      //设置变量 3                         if(a > 5){ 4                                console.log("哈哈"); 5                         }else{ 6                                console.log("嘻嘻"); 7                         } 8                  </script>

 

 

if语句也成为“选择语句”、“条件判断语句”，我们通过下面的图片来解释。

殊途同归，走了不一样的路，但是最后都要执行if结构体后面的语句。

条件表达式，要么是true、要么是false。绝对在计算机中，不可能出现模棱两可的情况。所以，if语句让程序有了“选择”，可以在两条路中选择一条。

 

小题目：

用户输入自己的考试成绩，提示用户是否及格。如果及格了，弹出警告框“恭喜，你及格了”、“不要骄傲啊”。如果没有及格，那么弹出警告框“很遗憾，你没有及格”、“请继续努力啊”。 然后都弹出“么么哒”。

答案：

1                  <script type="text/javascript"> 2                         //第一步，让用户输入自己的成绩。 3                         var score = parseFloat(prompt("请输入你的成绩")); 4                         //第二步，判断 5                         if(score >= 60){ 6                                alert("恭喜，你及格了！"); 7                                alert("不过不要骄傲啊！"); 8                         }else{ 9                                alert("很遗憾，你没有及格！"); 10                            alert("请继续加油啊！！"); 11                     } 12                     alert("么么哒"); 13              </script>

 

 

小题目：

用户输入自己的年龄，判断用户是否在18~70岁，如果在，那么弹出框框“恭喜，可以考驾照”，“加油啊”；

否则弹出“年龄不符合要求”。  最后，都要弹出“么么哒”。

 

1                  <script type="text/javascript"> 2                         //第一步，得到用户输入的年龄 3                         var age = parseInt(prompt("请输入年龄")); 4                         //第二步，判断。if的结构体 5                         if(age >= 18 && age <= 70){ 6                                alert("恭喜，可以考驾照"); 7                                alert("加油啊"); 8                         }else{ 9                                alert("年龄不符合要求"); 10                     } 11                     alert("么么哒"); 12              </script>

 

小题目：

判断用户输入的密码是否正确，如果是123，那么就弹出正确；如果不是，就弹出错误。

 

1                  <script type="text/javascript"> 2                         //第一步，得到用户输入的密码 3                         var password = prompt("请输入密码"); 4             5                         //第二步，判断 6                         if(password == 123){ 7                                alert("正确"); 8                         }else{ 9                                alert("错误"); 10                     } 11              </script>

 

3.2 多分支的if语句和跳楼现象

用户输入成绩，

如果成绩大于等于85，那么提示优秀；

否则如果成绩大于等于70，那么提示良好；

否则如果成绩60~69，那么提示及格；

否则，不及格

 

答案：

1                  <script type="text/javascript"> 2                         //第一步，得到用户输入的成绩 3                         var score = parseFloat(prompt("请输入成绩")); 4             5                         //第二步，判断 6                         if(score >= 85){ 7                                alert("优秀"); 8                         }else if(score >= 70){ 9                                alert("良好"); 10                     }else if(score >= 60){ 11                            alert("及格"); 12                     }else{ 13                            alert("不及格"); 14                     } 15              </script>

 

语法：

1           if(条件表达式1){ 2                  条件1为真的时候做的时候 3           }else if(条件表达式2){ 4                  条件1不满足，条件2满足的时候做的事情 5           }else if(条件表达式3){ 6                  条件1、2不满足，条件3满足的时候做的事情 7           }else{ 8                  全都不满足的时候做的事情 9           }

 

跳楼现象，揭示多分支if语句的本质，就是下一个楼层已经暗含之上的楼层都不满足。

 

 

小题目： 面试题，读下面的程序，试问控制台输出什么？

明天的考试，一定有类似的题目：

1                  <script type="text/javascript"> 2                         var a = 10; 3             4                         if(a > 5){ 5                                a = a + 3; 6                         }else if(a == 13){ 7                                a = a + 4; 8                         }else if(a == 17){ 9                                a = a + 5; 10                     }else{ 11                            a = a + 6; 12                     } 13         14                     console.log(a); 15              </script>

 

小练习：【分组探究作业】根据BMI（身体质量指数）显示一个人的体型。

BMI指数，就是体重、身高的一个计算公式。公式是：

BMI =体重÷身高的平方

 

比如，老师的体重是81.6公斤，身高是1.71米。

那么老师的BMI就是  81.6 ÷ 1.71²     等于 27.906022365856163

 

过轻：低于18.5

正常：18.5-24.99999999

过重：25-27.9999999

肥胖：28-32

非常肥胖, 高于32

 

用JavaScript开发一个程序，让用户先输入自己的体重，然后输入自己的身高（弹出两次prompt框）。计算它的BMI，根据上表，弹出用户的身体情况。比如“过轻” 、 “正常” 、“过重” 、 “肥胖” 、“非常肥胖”。在程序开发中，充分考虑跳楼现象，不允许出现多余的东西。

 

 

方法1：

1                  <script type="text/javascript"> 2                         //第一步，输入身高和体重 3                         var height = parseFloat(prompt("请输入身高，单位是米")); 4                         var weight = parseFloat(prompt("请输入体重，单位是公斤")); 5             6                         //第二步，计算BMI指数 7                         var BMI = weight / Math.pow(height,2); 8             9                         //第三步，if语句来判断。注意跳楼现象 10                     if(BMI < 18.5){ 11                            alert("过轻，嘻嘻嘻，你不怕被风吹走啊？？多吃点吧！"); 12                     }else if(BMI < 25){ 13                            alert("正常，真好！！"); 14                     }else if(BMI < 28){ 15                            alert("过重!还好啊！"); 16                     }else if(BMI <= 32){ 17                            alert("肥胖,注意减肥啊！"); 18                     }else{ 19                            alert("非常肥胖！"); 20                     } 21              </script>

 

方法2：

1                  <script type="text/javascript"> 2                         //第一步，输入身高和体重 3                         var height = parseFloat(prompt("请输入身高，单位是米")); 4                         var weight = parseFloat(prompt("请输入体重，单位是公斤")); 5             6                         //第二步，计算BMI指数 7                         var BMI = weight / Math.pow(height,2); 8             9                         //第三步，if语句来判断。注意跳楼现象 10                     if(BMI > 32){ 11                            alert("非常肥胖"); 12                     }else if(BMI >= 28){ 13                            alert("肥胖"); 14                     }else if(BMI >= 25){ 15                            alert("过重"); 16                     }else if(BMI >= 18.5){ 17                            alert("正常") 18                     }else{ 19                            alert("偏瘦"); 20                     } 21              </script>

3.3 if语句的嵌套

小例子：

一个加油站为了鼓励车主多加油，所以加的多有优惠。

92号汽油，每升6元；如果大于等于20升，那么每升5.9；

97号汽油，每升7元；如果大于等于30升，那么每升6.95

编写JS程序，用户输入自己的汽油编号，然后输入自己加多少升，弹出价格。

 

 

两层：

1                         //第一步，输入 2                         var bianhao = parseInt(prompt("你想加什么油？填写92或者97")); 3                         var sheng = parseFloat(prompt("你想加多少升？")); 4             5                         //第二步，判断 6                         if(bianhao == 92){ 7                                //编号是92的时候做的事情 8                                if(sheng >= 20){ 9                                       var price = sheng * 5.9; 10                            }else{ 11                                   var price = sheng * 6; 12                            } 13                     }else if(bianhao == 97){ 14                            //编号是97的时候做的事情 15                            if(sheng >= 30){ 16                                   var price = sheng * 6.95; 17                            }else{ 18                                   var price = sheng * 7; 19                            } 20                     }else{ 21                            alert("对不起，没有这个编号的汽油！"); 22                     } 23         24                     alert("价格是" + price);

 

小例子：

某个公司要给员工发年终奖，为了奖励老员工，所以工作时间越长，发的越多，规则如下：

工作满0年                       发月薪的1倍月薪年终奖，如果月薪大于8000，那么就是发1.2倍

工作满1年                       发月薪的1.5倍月薪年终奖，如果月薪大于10000，那么就是发1.7倍

工作满2年，甚至更多              发月薪的3倍月薪年终奖，如果月薪大于12000，那么就是发3.2倍

 

用JS编写程序，让用户输入工作了几年，可以输入0，然后输入月薪。然后算年终奖。

 

答案见案例

 

3.4 if语句的小知识点

else部分可以省略。

1                  <script type="text/javascript"> 2                         var a = 10; 3                         if(a > 20){ 4                                alert("这个数字大于20"); 5                         } 6                  </script>

没有else部分，就是说没有“否则”，如果条件表达式不满足了，那么就什么都不做。

 

如果要做的事情，只有一句话，那么可以省略大括号（初学者尽量不要这么玩儿，一定要把大括号写完整）：

1                  <script type="text/javascript"> 2                         var a = 2; 3                         if(a > 5) alert("这个数字大于5"); 4                         alert("哈哈哈哈"); 5                  </script>

这个程序，a>5不满足，所以不能弹出“这个数字大于5” 。这是单行if语句，省略了大括号，

等价于：

1                  <script type="text/javascript"> 2                         var a = 2; 3                         if(a > 5){ 4                                alert("这个数字大于5"); 5                         } 6                         alert("哈哈哈哈"); 7                  </script>

所以“哈哈哈哈”是能够弹出的。