Javascript学习笔记-----条件语句、消息框、循环语句

     条件表达式决定了JavaScript程序的流向。其他语言对应该使用if-else语句还是switch语句的传统观点同样适用于JavaScript。由于不同的浏览器针对流程的控制进行了

   不同的优化。因此使用哪种技术更好没有定论。

        1、if-else对比switch

               使用if-else还是switch，最流行的方法是基于测试条件的数量来判断：条件数量越大，越倾向于switch而不是if-else。这通常归结于代码的易读性。这个观点认为，当

      循环条件较少时if-else更易读，当条件数量较多时switch更易读。考虑如下代码：

             

[javascript]  view plain copy

1. if(found){  
2.   //代码处理  
3. }else(){  
4.   //其他代码处理  
5. }  
6.   
7. switch(found){  
8.    case true:  
9.       //代码处理  
10.       break;  
11.    default:  
12.      //其他代码处理  
13. }  

      尽管两块代码完成的是相同的任务，但还是有很多人认为if-else语句比switch更容易度。然而，如果增加条件语句的数量，这种观点会被扭转过来：

            

[javascript]  view plain copy

1. if(color == 'red'){  
2.     //代码处理  
3. }else if(color == 'blue'){  
4.    //代码处理  
5. }else if(color == 'brown'){  
6.    //代码处理  
7. }else if(color == 'black'){  
8.    //代码处理  
9. }else {  
10.   //代码处理  
11. }  
12.   
13. switch(color){  
14.    case 'red':  
15.       //代码处理  
16.       break;  
17.    case 'blue':  
18.       //代码处理  
19.       break;  
20.    case 'brown':  
21.       //代码处理  
22.       break;  
23.    case 'black':  
24.       //代码处理  
25.       break;  
26.    default :  
27.      //代码处理  
28. }  

          大多数人会认为对于这段代码，switch表达式比if-else表达式可读性更好。

          事实证明，大多数情况下switch比if-else运行的要快，但只有当条件数量很大时才能快得明显。这个两个语句主要性能区别是：当条件增加时，if-else性能负担增加的程度比switch要多。

  因此，我们自然倾向于在数量较少是使用if-else，而在条件数量较大时使用switch。这从性能方面考虑也是合理的。

         通常来说，if-else适用于判断两个离散值或几个不同的值域。当判断多有两个离散值时，switch语句是更佳选择。

      2、优化 if-else       

                 优化if-else的目标是：最小化到达正确分支前所需判断的条件数量。最简单的优化方法是确保最可能出现的条件放到首位。考虑如下代码：

                       

[javascript]  view plain copy

1. if(value < 5){  
2.   //代码处理  
3. }else if(value > 5 && value < 10){  
4.    //代码处理  
5. }else{  
6.    //代码处理  
7. }  

               该段代码只有当value值经常小于5时才是最优的。如果value大于5或者等于10，那么每次到达正确分支之前必须经过两个判断条件。最终增加了这个语句的所消耗的平均时间。if-else中的条件

     语句总应该是按照从最大概率到最小概率的顺序排列，以确保运行速度最快。

             另一种减少条件判断次数的方法是把if-else组织成一系列嵌套的if-else语句。使用单个庞大的if-else通常会导致运行缓慢，因为每个条件都学要判断。例如：

              

[javascript]  view plain copy

1. if(value == 0){  
2.    return result0;  
3. }else if(value == 1){  
4.    return result1;  
5. }else if(value == 2){  
6.    return result2;  
7. }else if(value == 3){  
8.    return result3;  
9. }else if(value == 4){  
10.    return result4;  
11. }else if(value == 5){  
12.    return result5;  
13. }else if(value == 6){  
14.    return result6;  
15. }else if(value == 7){  
16.    return result7;  
17. }else if(value == 8){  
18.    return result8;  
19. }else if(value == 9){  
20.    return result9;  
21. }else if(value == 10){  
22.    return result10;  
23. }  

         在这个if-else表达式中，条件语句最多判断10次。假设value的值在1到10之间均匀分布。那么这会增加平均运行时间。为了最小化条件判断次数，代码可重写为一系列嵌套的if-else语句，比如：

             

[javascript]  view plain copy

1. if(value < 6){  
2.    if(value < 3){  
3.       if(value == 0){  
4.         return result0;  
5.       }else if(value == 1){  
6.          return result1;  
7.       }else{  
8.          return result2;  
9.       }  
10.    }else{  
11.      if(value == 3){  
12.         return result3;  
13.      }else if(value == 4){  
14.         return result4;  
15.      }else {  
16.         return result5;  
17.      }  
18.    }  
19. }else{  
20.    if(value < 8){  
21.       if(value == 6){  
22.          return result6;  
23.       }else{  
24.         return reuslt7;  
25.       }  
26.    }else{  
27.       if(value == 8){  
28.          return result8;  
29.       }else if(value == 9){  
30.         return result9;  
31.       }else{  
32.         return result10;  
33.       }  
34.    }  
35. }  

       重写后的if-else语句每次到达正确分支最多经过4次条件判断。它使用二分法把值域分成一系列的区间，然后逐步缩小范围。当值的范围均匀分布在0到10之间时，代码运行的平均时间大约是前面例子的一半。

这个方法非常适用于有多个值域需要测试的时候(如果是 离散值，那么switch语句通常更为合适)。

javascript 消息框

警告框经常用于确保用户可以得到某些信息。

当警告框出现后，用户需要点击确定按钮才能继续进行操作

[javascript]  view plain copy

1. alert("警告框");  
2. alert("这是带有 \n 换行的警告框！");  

确认框用于使用户可以验证或者接受某些信息

       如果用户点击确认，那么返回值为 true。如果用户点击取消，那么返回值为 false

[javascript]  view plain copy

1. if(confirm('你确认吗')){  
2.  alert("yes");  
3. }else{  
4.  alert("no");  
5. }  

提示框经常用于提示用户在进入页面前输入某个值。

当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。

如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null

[javascript]  view plain copy

1. var name = prompt("请输入你的名字！","default");  
2. if(name != null && name !=""){  
3.  alert("hello " + name);  
4. }else{  
5.  alert("你什么都没输入！");  
6. }  

javascript 循环语句

 for   将一段代码循环执行指定的次数

while  当指定的条件为 true 时循环执行代码

for 循环

[javascript]  view plain copy

1.  for (变量=开始值;变量<=结束值;变量=变量+步进值)   
2.   {  
3.     需执行的代码  
4.   }  
5.   
6. for(i=1;i<=6;i++){  
7.  document.write("<h" + i + ">这是标题 " + i)  
8.  document.write("</h" + i + ">")  
9. }  

while 循环

[javascript]  view plain copy

1. while (变量<=结束值)  
2. {  
3.     需执行的代码  
4. }  
5. var i=1;  
6. while(i<=6){  
7.   document.write("<h" + i + ">这是标题 " + i);  
8.   document.write("</h" + i + ">");  
9.   i = i+1;  
10. }  

for … in

 使用 for...in 语句来遍历数组内的元素
 for...in 语句用于对数组或者对象的属性进行循环操作。
 for ... in 循环中的代码每执行一次，就会对数组的元素或者对象的属性进行一次操作。

[javascript]  view plain copy

1. for (变量 in 对象)  
2. {  
3.     在此执行代码  
4. }  
5. var x;  
6. var arr = new Array();  
7. arr[0] = 'ar1';  
8. arr[1] = 'ar2';  
9. arr[2] = 'ar3';  
10.   
11. for(x in arr){  
12.  document.write(arr[x]+"</br>");  //结果为: ar1 ar2 ar3  
13. }  
14. -----------**-------------  
15. var x;  
16. var arr = new Array();  
17. arr[0] = 'ar1';  
18. arr[1] = 'ar2';  
19. arr[2] = 'ar3';  
20.   
21. for(x in arr){  
22.  document.write(x+"</br>");  //结果为: 1 2 3  
23. }  

return、break continue关键字

    return 语句用来规定从函数返回的值

function prod (v1,v2){
var res =  v1 * v2;
return res;
}
function funres (v1,v2){
  alert(prod(v1,v2));
}

使用 break 语句来终止循环。

[javascript]  view plain copy

1. for(i=0;i<10;i++){  
2.  if(i==5) {  
3.   break;  
4.  }  
5.  document.write(i+"</br>");  //结果为:0 1 2 3 4   
6. }  

 continue

使用 continue 语句来终止当前的循环，然后从下一个值继续执行

[javascript]  view plain copy

1. //使  
2.  for(i=0;i<10;i++){  
3.  if(i==5) {  
4.   continue;  
5.  }  
6.  document.write(i+"</br>");  //结果为:0 1 2 3 4 6 7 8 9  
7. }  

try...catch

作用是测试代码中的错误

  当我们在网上冲浪时，总会看到带有 runtime 错误的 Javascript 警告框，同时会询问我们“是否进行 debug？”。像这样的错误信息或许对开发人员有用，对用户则未必

有两种在网页中捕获错误的方法：

1、使用 try...catch 语句。(在 IE5+、Mozilla 1.0、和 Netscape 6 中可用)

2、使用 onerror 事件。这是用于捕获错误的老式方法。(Netscape 3 以后的版本可用)

[javascript]  view plain copy

1. try  
2. {  
3.    //在此运行代码  
4. }  
5. catch(err)  
6. {  
7.    //在此处理错误  
8. }  
9. function trycatchtest(){  
10.  try{  
11.    asdf();  
12.  } catch(err){  
13.   alert("发生了错误，代码"+err.description);  //执行时会抛出 asdf未定义  
14.  }  
15. }  
16.    

16、throw 语句

  声明的作用是创建 exception

throw声明的作用是创建 exception（异常）。你可以把这个声明与 try...catch 声明配合使用，以达到控制程序流并产生精确错误消息的目的。

语法:   throw(exception)    //  exception可以是字符串、整数、逻辑值或者对象。

[javascript]  view plain copy

1. function trycatchtest(){  
2.   var date = new Date();  
3.   var time = date.getHours();  
4.   try{  
5.   if(time ==10){  
6.    throw('e1');  
7.   }else if(time ==11){  
8.    throw('e2');  
9.   }else{  
10.    throw('e3');  
11.   }  
12.   }catch(err){  
13.    if(err == 'e1'){  
14.     alert("10点");  
15.    }else if(err =='e2'){  
16.     alert("11点");  
17.    }else{  
18.     alert("不知道！");  
19.    }  
20.   }  
21. }  

javascript 特殊字符

你可以在 JavaScript 中使用反斜杠来向文本字符串添加特殊字符。

[javascript]  view plain copy

1. document.write("this is an \" apple\"");  //输出为: this is an “apple”  

下面的表格列出了其余的特殊字符，这些特殊字符都可以使用反斜杠来添加到文本字符串中：

代码	输出
\'	单引号
\"	双引号
\&	和号
\\	反斜杠
\n	换行符
\r	回车符
\t	制表符
\b	退格符
\f	换页符