（6）javascript的程序控制结构及语句-----（1）条件判断-CSDN博客

程序控制结构及语句

编程就是将现实应用，转换为程序能够读得懂的语法语句。Javascript编程中对程序流程控制主要是通过条件判断语句、循环控制语句及continue、break来完成的，其中条件判断按预先设定的条件执行顺序，它包括if语句和switch语句；而循环控制语句则可以重复完成任务，它包括while语句、do...while语句及for语句。

一、条件判断语句：

条件判断语句就是对语句中不同条件的值进行判断，进而根据不同条件执行不同的语句。条件判断语句有“if条件语句”和“switch多分支语句”。

（1）、if条件语句

是条件选择语句，语法格式：

if (条件语句表达式)
  {
  只有当条件语句表达式为 true 时执行的代码
  }

例子1:
            var y;
             y=80;
             if(y>120) //表达式为false

                 alert("执行语句1信息");//if结构只能控制它下面一条语句

             alert("执行语句2");   //因y>120表达式为false，故执行此语句

        注意:只弹出  ”语句2“ ，而 ”此只执行语句1信息“  不会弹出

  例子2：

      var y;
      y=80;
      if(y>120){  //if控制{}所有语句

              alert("语句1");

              alert("语句2");

            }

  注意:两条都不执行，因为y>120为false

 注意:所有结构都是如此，默认只能控制结构下方一条语句，想控制多条必须加在大括号{}中

案例：

<!doctype html>
 <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"/> <meta name="keywords" content="javascript的程序控制结构与语句，javascript入门"> <meta name="description" content="老罗江湖"> <title> if语句的使用 </title> </head> <body> <p>如果时间早于21:00，会获得问候“very Good”。</p> <button onclick="myFunction()">单击这里</button> <p id="demo"></p> <script type="text/javascript"> function myFunction() { var x=""; var time=new Date().getHours(); //获取系统日期、获取此时此刻“时针数” if (time<22) //22代表“时间”填写时，注意根据时间而定。  { x="very Good"; } document.getElementById("demo").innerHTML=x; } </script> <p>请注意，上面在if语句中，没有 ..else..。您已经告诉浏览器只有在指定条件为 true 时才执行代码。</p> </body> </html>

效果图：

请使用小写的 if，使用大写字母（IF）会生成 JavaScript 错误！请注意，上面在if语句中，没有 ..else..。您已经告诉浏览器只有在指定条件为 true 时才执行代码。

2、if...else 语句 ：

用于需要用两个程序分支来执行的情况。 If...else语法：

If（条件表达式）
{
当 条件表达式 成立 “为true”时执行这语句段
}
else{
当 条件表达式 不成立“为false”时执行这语句段
}

//当条件为 true 时执行if后面的从句，当条件为 false 时执行else后面部分的从句。

案例：

<script type="text/javascript">
    var y = "Beautiful Girl"; if( y != "Beautiful Girl") { document.write('<h3 style="text-algin:center;color:pink;">欢迎素颜美女光临</h3>'); } else{ document.write('<p style="font-size:30px;color:red;">先天问题请化妆再来</p>'); }</script>

效果图：对变量y的值进行判断，如果y值不等于Beautiful Girl，则输出粉红色字符；否则输出红色字符。

3、If...else if...else语句

使用 if....else if...else语句来选择多个代码块之一来执行。语法格式：

if（条件1）
{
当条件1为true是执行的代码
}
else if(条件2)
{
当条件2为true时执行的代码
}
else{
当条件1和条件2都不为true是执行的代码
}

案例：

 <title> if...else if...else语句的使用 </title> </head> <body> <p>如果时间早于21:00，会获得问候“very Good”。</p> <button onclick="myFunction()">单击这里</button> <p id="demo"></p> <script type="text/javascript"> function myFunction() { var d = new Date(); //获取系统日期 var time=d.getHours(); //获取此时此刻“时针数” if (time<10) { document.write('Good morning'); } else if (time<18) { document.write('Good afternoon'); } else { document.write('Good evening'); } } </script> </body>

效果图：如果时间小于 10:00，则将发送问候 "Good morning"，否则如果时间小于 18:00，则发送问候 "Good afternoon"，否则发送问候 "Good evening"，因此时是晚上九点钟，所以输出的结构为下图：

4、if语句的嵌套

If语句可以嵌套使用。当使用if语句的嵌套应用时，最好使用“{ }”来确定相互的层次关系，由于大括号“{ }”使用的位置不同，可能导致程序代码的含义完全不同，从而输出不同的结果。

案例：

<title> if语句的嵌套 </title> </head> <body> <script type="text/javascript"> var x=20;y=x; //x、y值都为20 if(x<1) //x为20，不满足此条件，故其下面的代码不会执行  { if(y==5) alert("x<1&&y==5"); else alert("x<1&&y!==5"); } else if(x>15) //x满足条件，继续执行下面的语句  { if(y==5) //y为20，不满足此条件，故其下面的代码不会执行（已满足的不会被执行）  alert("x>15&&y==5"); else //y满足条件，继续执行下面的语句  alert("x>15&&y!==5") //这里是程序输出的结果  } </script> </body>

效果图：

5、switch语句

switch选择语句用于将一个表达式的结果同多个值进行比较，并根据比较结果选择执行语句。语法：

Switch（表达式）
{
aase取值1：
语句块1；break
case取值2：
   语句块2；break；
...
case取值n：
   语句块n；break； Default： 语句块n+1; }

switch必须赋初始值，值与每个case值匹配。满足执行该case后的所有语句，并用break语句来阻止运行下一个case。如所有case值都不匹配，执行default后的语句。记得在case所执行的语句后添加上一个break语句，否则就直接继续执行下面的case中的语句。

案例：

<script type="text/javascript">
var now=new Date();
var day=now.getDay();  //获取系统当前日期 var week; switch (day){ case 1: week="Monday"; break;
case 2: week="Tuesday"; break; case 3: week="Wednesday"; break; case 4: week="Thursday"; break; case 5: week="Friday"; break; case 6: week="Saturday"; break; default: week="Sunday"; break; } document.write("今天是"+week); //输出今天是星期几 </script>