首頁 > web前端 > js教程 > JavaScript 學習筆記之語句_基礎知識

JavaScript 學習筆記之語句_基礎知識

WBOY
發布: 2016-05-16 16:20:14
原創
1093 人瀏覽過

一、條件分支語句:if

基本格式:

if (){
   
}else if (){
   
}else{
   
}

執行流程:

二、循環語句

2.1前測試循環語句:在循環體內的程式碼被執行之前就對出口條件求值。

2.1.1while語句

基本格式:

do {
   
} while ()

執行流程:


2.1.2 for語句

基本格式:
for (;;){
   
}

執行流程:
 


2.2後測試循環語句:在循環體中的程式碼被執行之後才會測試出口條件。

2.2.1、do-while語句

基本格式:

do {
   
} while () ;

執行流程:

三、精準的迭代語句:for-in

基本格式:
for ( 屬性 in 物件 ){
   
}

作用:重複執行指定物件的所有屬性,可以用來列舉物件的屬性。

 範例:

複製程式碼 程式碼如下:



點選下面的按鈕,循環遍歷物件 "person" 的屬性。




<script><br /> function myFunction()<br /> {<br /> var x;<br /> var txt="";<br /> var person={fname:"Bill",lname:"Gates",age:56}; <br /> for (x in person)<br /> {<br /> txt=txt person[x];<br /> }<br /> document.getElementById("demo").innerHTML=txt;<br /> }<br /> </script>


如果要表示的物件為null或undefined,循環體將不再執行,或拋出錯誤,因此,在執行for-in迴圈時,應該先偵測改物件的屬性值是不是null或是undefined。

四、Lable語句

基本語法:

Label:

如: begin: for (var i = 0; i                          alert(i);
                   }
舉例說明lable語句的作用:
未加lable:

複製程式碼 程式碼如下:

var num = 0;
        for (var i = 0 ; i              for (var j = 0 ; j                   if( i == 5 && j == 5 ){
                        break;
                  }
             num ;
             }
        }
        alert(num);//95

加入lable:

複製程式碼 程式碼如下:

var num = 0;
    outPoint:
    for (var i = 0 ; i          for (var j = 0 ; j               if( i == 5 && j == 5 ){
                    break outPoint;
              }
         num ;
         }
    }
    alert(num); //55

第一個例子輸出95不難理解,第二個例子為什麼輸出55呢,是因為執行到break outpoint時,直接跳出到putpoint層,執行alert語句。

如果把第二個例子改成下面這樣:

複製程式碼 程式碼如下:

                var num = 0;
                 for (var i = 0 ; i                      outPoint:
                     for (var j = 0 ; j                          if( i == 5 && j == 5 ){
                             break outPoint:;
;
;                          }
                         num ;
                     }
                 };
         alert(num);//95

這個結果和第一個例子的結果是一致的。

五、break和continue語句

5.1break語句:

程式碼如下:


       var num = 0;
        for (var i = 1 ; i             if(i%5==0){
                break;
            }
            num ;
        };
        alert(num);//4

break語句執行後跳到alert語句

5.2continue語句:

程式碼如下:


  var num = 0;
  for (var i = 1 ; i      if(i%5==0){
        continue;
     }
       num ;
   };
   alert(num);//8

continue語句執行後跳到for()循環,繼續執行循環,直到循環條件不成立。

六、with語句

基本語法:


with (object) {
    statements
}
舉例說明:

不使用with的寫法:

程式碼如下:

var qs = location.search.substring(1);
var hostName = location.hostname;     
var url = location.href;
 alert(qs);
 alert(hostName);
 alert(url);

使用with的寫法:

複製程式碼 程式碼如下:

  with(location){
             var qs = search.substring(1);
             var hostName = hostname;     
             var url = href;
         }
         alert(qs);
         alert(hostName);
         alert(url);

從上面例子可以看出:with語句的作用是將程式碼的作用域設定到一個特定的物件中、減少的重複輸入。

但是js的解釋器需要檢查with區塊中的變數是否屬於with包含的對象,這將使with語句執行速度大大下降,並且導致js語句很難被最佳化。

因此不建議大規模使用with語句。

七、swith語句

基本語法:
switch () {
    case :
                 break;
    case :
                 break;
    ...
    default
}

執行流程:

switch語句可以是任何資料型,每個case的值也不一定是常數,也可以是變數、表達式等,例如:

複製程式碼 程式碼如下:

  switch ("hello world") {
             case "hello" " world":
                 alert("Greeting was found.");
                 break;
             case "goodbye":
                 alert("Closing was found.");
                 break;
             default:
                 alert("Unexpected message was found.");
         }

複製程式碼 程式碼如下:

         var num = 25;
         switch (true) {
             case num                  alert("Less than 0.");
                 break;
             case num >= 0 && num                  alert("Between 0 與 10.");
                 break;
             case num > 10 && num                  alert("Between 10 與 20.");
                 break;
             default:
                 alert("More than 20.");
         }

switch語句在比較時使用的是全等運算子比較,因此不會發生型別轉換。

練習:

複製程式碼 程式碼如下:

 

for(;;){
    alert("2");//輸出幾次2?
}

以上就是本文的全部內容了,希望對小夥伴們能夠有所幫助。

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板