第二部分

第4章 JavaScript技術詳解

JavaScript在頁面控制方面起著不可代替的作用，但它在編程方面的一些不好的習慣也飽受詬病，但自從Prototype推出以后，開發人員突然發現，原來JavaScript可以使用面向對象的方式編程，也可以促使開發人員養成良好的編程習慣。

本章首先對JavaScript的基礎知識進行介紹，然后重點講解JavaScript的函數、對象和事件處理機制，以及如何使用JavaScript來面向對象編程，最后著重講解XMLHttpRequest對象，從而使讀者真正理解JavaScript的強大功能。

4.1 JavaScript語言基礎

Netscape公司首先引進了Sun公司有關Java的概念，將自己原有的LiveScript進行重新設計，并改名為JavaScript。隨后其他的瀏覽器也支持了這種腳本語言，但支持的版本及某些語法可能有所改變，這也造成開發人員在編寫JavaScript代碼時要考慮支持多種版本的問題。

4.1.1 變量和數據類型

JavaScript中的變量命名與其他計算機編程語言非常相似，變量用來存放腳本中的值。JavaScript是一種對數據類型變量要求不太嚴格的語言，所以不必聲明每一個變量的類型，但在使用變量之前先進行聲明是一種好的習慣。JavaScript使用var語句來進行變量聲明，區分大小寫，變量名稱的長度是任意的，但必須遵循以下規則：

● 第一個字符必須是一個字母、一個下畫線（_）或一個美元符號（$）。

● 其他的字符可以是字母、數字、下畫線或美元符號，變量名稱中不能有空格、+、－等其他符號。

● 變量名稱不能是保留字，比如var、int、double、true等都不能作為變量的名稱。

JavaScript有6種數據類型，分別是Number、Boolean、String、Object、Null和Undefined。

● Number（數值）：包括整數、浮點數及NaN（非數）值，整數可以為正數、零或者負數；浮點數可以包含小數點。

● Boolean（布爾）：Boolean值有true和false，不能用1和0來表示。

● String（字符串）：字符串用單引號或雙引號來表示。

● Object（對象）：包括數組類型Array、日期對象Date等。

● Null（空）：如果為Null，就表示為空或不存在。

● Undefined（未定義）：表示變量已經被創建，但未賦值。

下面分別介紹一下數值、布爾和字符串類型。

● 數值類型：JavaScript的整數可以使用八進制、十進制和十六進制來表示。八進制數的第一位必須是0，十六進制數的前兩位必須是0X或0x。

● 布爾類型：JavaScript中只能用true或false表示其狀態，而不能用1或0表示，但當布爾值用于數值表達式時，true和false將自動轉換成1和0。

● 字符串類型：用來說明字符串的單引號或雙引號必須是成對出現的，在JavaScript中也以反斜杠“\”開頭定義了若干個不可顯示的特殊字符。如果要在字符串中使用反斜杠，或者在單引號括起來的字符串中使用單引號，以及在雙引號括起來的字符串中使用雙引號，則都需要使用反斜杠作為轉義符。JavaScript中的轉義符如表4.1所示。

表4.1 JavaScript中的轉義符

● 變量的作用域，在JavaScript中變量分為全局變量和局部變量。全局變量定義在所有函數體之外，其作用范圍是整個腳本；而局部變量則定義在函數體之內，只對該函數可見，而對其他函數是不可見的。

4.1.2 運算符和表達式

運算符是完成操作的一系列符號，使用運算符的值稱為算子或操作數。在JavaScript中包括以下7種運算符：

● 算術運算符。

● 邏輯運算符。

● 字符串運算符。

● 比較運算符。

● 條件運算符。

● 賦值運算符。

● 位操作運算符。

在上述7種運算符中，只有條件運算符是三目運算符，其他的都是雙目運算符或單目運算符，下面分別進行介紹。

（1）算術運算符：JavaScript中的算術運算符主要有7種，如表4.2所示。

表4.2 JavaScript中的算術運算符

（2）邏輯運算符：JavaScript中的邏輯運算符主要有3種，如表4.3所示。

表4.3 JavaScript中的邏輯運算符

（3）字符串運算符：JavaScript中的字符串運算符主要有1種，如表4.4所示。

表4.4 JavaScript中的字符串運算符

（4）比較運算符：JavaScript中的比較運算符主要有8種，如表4.5所示。

表4.5 JavaScript中的比較運算符

（5）條件運算符：JavaScript中的條件運算符主要有1種，如表4.6所示。

表4.6 JavaScript中的條件運算符

（6）賦值運算符：JavaScript中的賦值運算符主要有12種，如表4.7所示。

表4.7 JavaScript中的賦值運算符

（7）位操作運算符：JavaScript中的位操作運算符主要有7種，如表4.8所示。

表4.8 JavaScript中的位操作運算符

上述運算符都有一定的優先級，如表4.9所示。

表4.9 JavaScript中運算符的優先級

4.1.3 程序控制語句

程序控制語句使得程序能夠按照一定的方式執行，程序的邏輯都是通過程序控制語句來實現的，下面是JavaScript常用的程序控制語句。

（1）if條件語句：

      if(表述式)
      語句段;
      …

代碼說明：

● 若表達式為真，則執行語句段。

● 如果要執行的語句段有多條語句，則要用花括號將語句括起來。多條語句可以寫在一行，以分號“;”分隔，也可以寫成多行。為了美觀，建議寫成多行。

當表達式為假時，要執行另外的語句，則需要使用if…else語句，如下所示：

      if(表述式)
          語句段1;
          ...
          else
          語句段2;
          …

代碼說明：

● 若表達式為true，則執行語句段1；否則執行語句段2。

● 若語句段有多行，則必須使用花括號將其括起來。

● 語句段還可以是if語句，從而實現if語句的嵌套，但建議嵌套一般不超過3層。

（2）switch語句：通過if語句可以實現對多個表達式進行判斷，從而選擇要執行的語句。但這里有另外一種更好的對多個表達式語句進行判斷的寫法，那就是通過switch語句，示例代碼如下：

      switch(表達式){
          case value1;
              語句段1;
              Break;
          case value2;
              語句段2;
              Break;
          ...
          default:
              語句段n;
      }

代碼說明：

如果表達式的值等于value1，則執行語句段1，然后跳出該switch語句；如果表達式的值等于value2，則執行語句段2，然后跳出該switch語句；如果都不相等，則執行default后面的語句段n。

（3）for循環語句：用于在某個條件下重復執行一段代碼。示例代碼如下：

      for(初始化;條件;增量){
          循環語句;
      }

代碼說明：

● 初始化參數告訴循環前必須初始化變量。

● 如果條件為真，則執行語句，否則跳出循環體。

● 增量主要定義循環控制變量在每次循環時按什么方式變化。

● 初始化、條件、增量這3個語句之間，必須使用分號分隔。

● for語句可以實現循環嵌套，但建議一般嵌套不超過3層。

（4）while循環語句：是另外一種循環語句的表示方式，該語句沒有初始化變量和增量。示例代碼如下：

      while(條件){
          循環語句;
      }

代碼說明：

● 當條件為真時，重復循環，否則退出循環。

● 首先判斷條件如果為假，則直接跳出循環，不執行循環語句。

（5）do…while語句：while語句的變體，示例代碼如下：

      do {
          循環語句;
      } while(表達式)

代碼說明：

先執行一次循環語句，然后判斷表達式的值，如果為真，則繼續執行循環語句；如果為假，則跳出循環。

（6）break和continue語句：使用break語句可以跳出循環語句，使用continue語句可以跳過循環內剩余的語句而進入下一次循環。

（7）label語句：用于為語句添加標號。