基本語法 · 學習講義 2019

## 一、語句 JavaScript 程序的執行單位為行（line），也就是一行一行地執行。一般情況下，每一行就是一個語句。語句（statement）是為了完成某種任務而進行的操作，比如下面就是一行賦值語句。 ``` var a = 1 + 3; ``` 這條語句先用`var`命令，聲明了變量`a`，然后將`1 + 3`的運算結果賦值給變量`a`。 `1 + 3`叫做表達式（expression），指一個為了得到返回值的計算式。語句和表達式的區別在于，前者主要為了進行某種操作，一般情況下不需要返回值；后者則是為了得到返回值，一定會返回一個值。語句以分號結尾，一個分號就表示一個語句結束。多個語句可以寫在一行內。 ~~~ var a = 1 + 3 ; var b = 'abc'; ~~~ ## 二、變量變量是對“值”的具名引用。變量就是為“值”起名，然后引用這個名字，就等同于引用這個值。變量的名字就是變量名。 ~~~ var a = 1; ~~~ 上面的代碼先聲明變量`a`，然后在變量`a`與數值1之間建立引用關系，稱為將數值1“賦值”給變量`a`。以后，引用變量名`a`就會得到數值1。最前面的`var`，是變量聲明命令。它表示通知解釋引擎，要創建一個變量`a`。變量的聲明和賦值，是分開的兩個步驟，上面的代碼將它們合在了一起，實際的步驟是下面這樣。 ~~~ var a; a = 1; ~~~ 如果只是聲明變量而沒有賦值，則該變量的值是`undefined`。`undefined`是一個特殊的值，表示“無定義”。 ## 三、標識符標識符（identifier）指的是用來識別各種值的合法名稱。最常見的標識符就是變量名，以及后面要提到的函數名。標識符有一套命名規則，不符合規則的就是非法標識符。JavaScript 引擎遇到非法標識符，就會報錯。簡單說，標識符命名規則如下。 * 第一個字符，可以是任意 Unicode 字母（包括英文字母和其他語言的字母），以及美元符號（`$`）和下劃線（`_`）。 * 第二個字符及后面的字符，除了 Unicode 字母、美元符號和下劃線，還可以用數字`0-9`。 > JavaScript 有一些保留字，不能用作標識符：arguments、break、case、catch、class、const、continue、debugger、default、delete、do、else、enum、eval、export、extends、false、finally、for、function、if、implements、import、in、instanceof、interface、let、new、null、package、private、protected、public、return、static、super、switch、this、throw、true、try、typeof、var、void、while、with、yield。 ## 四、注釋源碼中被 JavaScript 引擎忽略的部分就叫做注釋，它的作用是對代碼進行解釋。JavaScript 提供兩種注釋的寫法：一種是單行注釋，用`//`起頭；另一種是多行注釋，放在`/*`和`*/`之間。 ``` // 這是單行注釋 /* 這是多行注釋 */ ``` 此外，由于歷史上 JavaScript 可以兼容 HTML 代碼的注釋，所以``也被視為合法的單行注釋。 ## 五、條件語句 JavaScript 提供`if`結構和`switch`結構，完成條件判斷，即只有滿足預設的條件，才會執行相應的語句。 ### 5.1 if 結構 `if`結構先判斷一個表達式的布爾值，然后根據布爾值的真偽，執行不同的語句。所謂布爾值，指的是 JavaScript 的兩個特殊值，`true`表示真，`false`表示`偽`。 ~~~ if (布爾值) 語句; // 或者 if (布爾值) 語句; ~~~ 上面是`if`結構的基本形式。需要注意的是，“布爾值”往往由一個條件表達式產生的，必須放在圓括號中，表示對表達式求值。如果表達式的求值結果為`true`，就執行緊跟在后面的語句；如果結果為`false`，則跳過緊跟在后面的語句。 ~~~ if (m === 3) m = m + 1; ~~~ 上面代碼表示，只有在`m`等于3時，才會將其值加上1。這種寫法要求條件表達式后面只能有一個語句。如果想執行多個語句，必須在`if`的條件判斷之后，加上大括號，表示代碼塊（多個語句合并成一個語句）。 ~~~ if (m === 3) { m += 1; } ~~~ ### 5.2 if...else 結構 `if`代碼塊后面，還可以跟一個`else`代碼塊，表示不滿足條件時，所要執行的代碼。 ~~~ if (m === 3) { // 滿足條件時，執行的語句 } else { // 不滿足條件時，執行的語句 } ~~~ 上面代碼判斷變量`m`是否等于3，如果等于就執行`if`代碼塊，否則執行`else`代碼塊。對同一個變量進行多次判斷時，多個`if...else`語句可以連寫在一起。 ~~~ if (m === 0) { // ... } else if (m === 1) { // ... } else if (m === 2) { // ... } else { // ... } ~~~ ### 5.3 switch 結構多個`if...else`連在一起使用的時候，可以轉為使用更方便的`switch`結構。 ~~~ switch (fruit) { case "banana": // ... break; case "apple": // ... break; default: // ... } ~~~ 上面代碼根據變量`fruit`的值，選擇執行相應的`case`。如果所有`case`都不符合，則執行最后的`default`部分。需要注意的是，每個`case`代碼塊內部的`break`語句不能少，否則會接下去執行下一個`case`代碼塊，而不是跳出`switch`結構。 ~~~ var x = 1; switch (x) { case 1: console.log('x 等于1'); case 2: console.log('x 等于2'); default: console.log('x 等于其他值'); } // x等于1 // x等于2 // x等于其他值 ~~~ 上面代碼中，`case`代碼塊之中沒有`break`語句，導致不會跳出`switch`結構，而會一直執行下去。正確的寫法是像下面這樣。 ~~~ switch (x) { case 1: console.log('x 等于1'); break; case 2: console.log('x 等于2'); break; default: console.log('x 等于其他值'); } ~~~ ## 六、循環語句循環語句用于重復執行某個操作，它有多種形式。 ### 6.1 while 循環 `While`語句包括一個循環條件和一段代碼塊，只要條件為真，就不斷循環執行代碼塊。 ~~~ while (條件) { 語句; } ~~~ 下面是`while`語句的一個例子。 ~~~ var i = 0; while (i < 100) { console.log('i 當前為：' + i); i = i + 1; } ~~~ 上面的代碼將循環100次，直到`i`等于100為止。 ### 6.2 for 循環 `for`語句是循環命令的另一種形式，可以指定循環的起點、終點和終止條件。它的格式如下。 ~~~ for (初始化表達式; 條件; 遞增表達式) 語句 // 或者 for (初始化表達式; 條件; 遞增表達式) { 語句 } ~~~ `for`語句后面的括號里面，有三個表達式。 * 初始化表達式（initialize）：確定循環變量的初始值，只在循環開始時執行一次。 * 條件表達式（test）：每輪循環開始時，都要執行這個條件表達式，只有值為真，才繼續進行循環。 * 遞增表達式（increment）：每輪循環的最后一個操作，通常用來遞增循環變量。 ### 6.3 do...while 循環 `do...while`循環與`while`循環類似，唯一的區別就是先運行一次循環體，然后判斷循環條件。 ~~~ do 語句 while (條件); // 或者 do { 語句 } while (條件); ~~~ 不管條件是否為真，`do...while`循環至少運行一次，這是這種結構最大的特點。另外，`while`語句后面的分號注意不要省略。 ### 6.4 break 語句和 continue 語句 `break`語句和`continue`語句都具有跳轉作用，可以讓代碼不按既有的順序執行。 * `break`語句用于跳出代碼塊或循環。 ~~~ var i = 0; while(i < 100) { console.log('i 當前為：' + i); i++; if (i === 10) break; } ~~~ 上面代碼只會執行10次循環，一旦`i`等于10，就會跳出循環。 * `continue`語句用于立即終止本輪循環，返回循環結構的頭部，開始下一輪循環。 ~~~ var i = 0; while (i < 100){ i++; if (i % 2 === 0) continue; console.log('i 當前為：' + i); } ~~~ 上面代碼只有在`i`為奇數時，才會輸出`i`的值。如果`i`為偶數，則直接進入下一輪循環。