DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> 深入理解ECMAScript的幾個關鍵語句
深入理解ECMAScript的幾個關鍵語句
編輯:JavaScript基礎知識     

寫在前面

在這一章中我們聊一聊ECMAScript中的幾個關鍵語句switch、for-in、label等語句,加深我們對它們的理解和認識。首先從最常見的說起。

while和for

while和for是很常規的語句,無論是在JavaScript還是C還是其他編程語言中。而且在編程中我們較常用的也是for,for用起來更靈活,更簡單,所以有些人可能就會產生這樣一種誤解:

for比while更強大,能做到while做不到的一些事情。

其實我們稍微想想while和for語句的語法應用,我們就會發現:

while循環做不到的for循環也做不到。

這是因為for循環只是把while循環有關的代碼集中在了一起而已,其實有些時候,用while循環比用for循環更簡單。這也是各司其職各有利弊吧。

關於循環的另一點,我們先看一段代碼:

for(i=0;i<5;i++){
  console.log(i);
}
console.log(i);

在循環外打印i,打印輸出是5。

可以看到,在循環內部定義的變量在外部也是可以訪問的。在一些語言中比如C,大括號定義的是塊級作用域,但是在ECMAScript中是沒有塊級作用域這個概念的,所以在循環內部定義的變量在外部也是可以訪問的。

switch語句

在其他編程語言中比如C,switch語句只能使用數字,而在ECMAScript中,switch語句可以使用任何數據類型,像字符串、對象都是可以的。

這裡有一點需要說明:switch語句比較的時候使用的全等操作符,即===,所以'10'和10不相等,因為在進行全等比較的時候,並不發生類型轉換。

for-in語句

for-in語句是一種精確性的迭代語句,可以用來遍歷對象的屬性,當然也可以迭代數組的屬性。下面分別以例子說明:

for-in遍歷對象

•window

先遍歷一個特殊的對象window:

for(var i in window){
  console.log(i);
}

會打印出一串很長很長的屬性列表,大家可自行查看,在此不一一羅列贅述。

•自定義對象

遍歷自定義對象

var o={prop1:'value1', prop2:'value2', prop3:'value3'};
for (var i in o){
  console.log(i);
}

打印出prop1 prop2 prop3。

•數組

遍歷數組

var array1=[1,2,3,4];
for(var i in array){
  console.log(i);
}

打印輸出1 2 3 4。

with語句

with語句可以用來限制作用域,即可以將代碼的作用域設置到一個特定的對象中。如下:

var hostname=location.hostname;
var url=location.href;

這兩句分別獲取hostname和url,因為它們共用location(同一個對象下的屬性),所以我們可以將作用域限定在location中,即用with語句關聯location對象。如下:

with(location){
  
  var hostname=hostname;
  var url=href;
}

需要注意的是:嚴格模式下使用with語句會有語法錯誤,同時,大量使用with語句會導致性能下降,同時也會給調試帶來一定的困難,所以在開發應用程序的時候,尤其是開發大型應用程序的時候,並不建議使用with語句。

label語句

label語句用來在代碼中加標簽,從而可以在以後來使用它。一般情況下,加標簽的語句要和for循環等循環語句配合來使用。

它的語法是:

label: statement

下面給出代碼詳細來看看label標簽的用法。

1、先給出一段基本的代碼:

var num=0;
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      break;
    }
    num++;
  }
}
console.log(num);

說明:break跳出了處在內部的for循環,j剩下的5次循環不再執行,所以打印的結果是95。

2、接下來我們將break換成continue:

var num=0;
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      break;
    }
    num++;
  }
}
console.log(num);

說明:continue跳出了本次循環,就是說跳出了處在內部for循環的這一次循環,所以打印的結果是99。

3、接下來我們加上一個名為outer的label標簽再分別看打印結果:

var num=0;
outer:
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      break outer;
    }
    num++;
  }
}
console.log(num);

說明:加上了標簽以後,用break跳到了標簽outer處,就是說程序跳出了外循環,即程序執行到了i=5且j=5時停止執行,所以打印的結果是55。

4、我們再換成continue看看:

var num=0;
outer:
for(var i=0;i<10;i++){
  for(var j=0;j<10;j++){
    if(i==5&&j==5){
      continue outer;
    }
    num++;
  }
}
console.log(num);

說明:這一次用的是continue,所以當程序執行到i=5且j=5時並沒有跳出外循環,而只是跳出了內循環,即剩下的5次不予執行,所以打印的結果是95。

放在一起這幾個顯得稍微有些混淆,多理解理解就會好很多。

小結

我們學習一門東西不是為學而學,是為用而學,說白了就是為了工作而學,所以單純理解上面的東西不是最重要的,不是為記而記,是為用而記,能夠熟練運用在實踐中才是我們希望的。同時,做筆記是一個很好的習慣,好記性不如爛筆頭,如果你在做,那麼希望你堅持下去。

以上這篇深入理解ECMAScript的幾個關鍵語句就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved