《JavaScript 闖關記》之語句

時間  2019-11-16
標籤 JavaScript 闖關記 語句 欄目 JavaScript 简体版
原文   原文鏈接

表達式在 JavaScript 中是短語，那麼語句就是整句命令。表達式用來計算出一個值，語句用來執行以使某件事發生。從本質上看，語句定義了 JavaScript 中的主要語法，語句一般使用一或多個關鍵字來完成給定任務。語句能夠很簡單，例如通知函數退出；也能夠比較複雜，例如指定重複執行某個命令的次數。下表列出了 JavaScript 大部分語句的語法和用途：javascript

語句 語法 用途
break break [label]; 退出最內層循環或者退出 switch 語句，又或者退出 label 指定的語句
case case expression: 在 switch 語句中標記一條語句
continue continue [label]; 從新開始最內層的循環或從新開始 label 指定的循環
debugger debugger; 斷點器調試
default default; 在 switch 中標記默認的語句
do-while do statement while(expression); while 循環的一種替代形式
empty ; 什麼都不作
for for(init;expr;incr) statement 簡寫的循環結構
for-in for(var in object) statement 遍歷一個對象的屬性
function function name([param[],...])
{statement} 		聲明一個函數
if-else if (expression) statement1
[else statement2] 		執行 statement1 或者 statement2
label label:statement 給 statement 指定一個名字 label
return return [expression]; 從函數返回一個值
switch switch(expression){statement} 用 case 或者 default 語句標記的多分支語句
throw throw expression; 拋出異常
try try {statement}
[catch {handler statement}]
[finally {cleaup statement}] 		捕獲異常
use strict "use strict" 對腳本和函數應用嚴格模式
var var name=[=expr][,...]; 聲明並初始化一個或多個變量
while while(expression) statement 基本的循環結構
with with(object) statement 擴展做用域鏈

條件語句

if-else 語句

大多數編程語言中最爲經常使用的一個語句就是 if-else 語句。如下是 if-else 語句的語法：java

if (condition) statement1 [else statement2]

其中的 condition 能夠是任意表達式；並且對這個表達式求值的結果不必定是布爾值。JavaScript 會自動調用 Boolean() 轉換函數將這個表達式的結果轉換爲一個布爾值。若是對 condition 求值的結果是 true，則執行 statement1，若是對 condition 求值的結果是 false，則執行 statement2。並且這兩個語句既能夠是一行代碼，也能夠是一個代碼塊（以一對花括號括起來的多行代碼）。請看下面的例子：git

if (i > 25)
    console.log("Greater than 25.");              // 單行語句
else {
    console.log("Less than or equal to 25.");     // 代碼塊中的語句
}

業界廣泛推崇的最佳實踐是始終使用代碼塊，即便要執行的只有一行代碼。由於這樣能夠消除人們的誤解，不然可能讓人分不清在不一樣條件下要執行哪些語句。github

switch 語句

switch 語句與 if 語句的關係最爲密切，並且也是在其餘語言中廣泛使用的一種流控制語句。JavaScript 中 switch 語句的語法與其餘基於 C 的語言很是接近，以下所示：express

switch (expression) {
  case value: statement
    break;
  case value: statement
    break;
  case value: statement
    break;
  case value: statement
    break;
  default: statement
}

switch 語句中的每一種情形的含義是：「若是表達式等於這個值（value），則執行後面的語句（statement）」。而 break 關鍵字會致使代碼執行流跳出 switch 語句。若是省略 break 關鍵字，就會致使執行完當前 case 後，繼續執行下一個 case。最後的 default 關鍵字則用於在表達式不匹配前面任何一種情形的時候，也至關於一個 else 語句。從根本上講，switch 語句就是爲了讓開發人員免於編寫像下面這樣的代碼：編程

if (i === 25){
  console.log("25");
} else if (i === 35) {
  console.log("35");
} else if (i === 45) {
  console.log("45");
} else {
  console.log("Other");
}

而與此等價的switch語句以下所示：瀏覽器

switch (i) {
    case 25: 
        console.log("25");
        break;
    case 35: 
        console.log("35");
        break;
    case 45: 
        console.log("45");
        break;
    default: 
        console.log("Other");
}

經過爲每一個case後面都添加一個break語句，就能夠避免同時執行多個case代碼的狀況。假如確實須要混合幾種情形，不要忘了在代碼中添加註釋，說明你是有意省略了break關鍵字。微信

雖然 JavaScript 中的 switch 語句借鑑自其餘語言，但這個語句也有本身的特點。首先，能夠在 switch 語句中使用任何數據類型（在不少其餘語言中只能使用數值），不管是字符串，仍是對象都沒有問題。其次，每一個 case 的值不必定是常量，能夠是變量，甚至是表達式。請看下面這兩個例子：less

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

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

switch 語句首先計算 switch 關鍵字後的表達式，而後按照從上到下的順序計算每一個 case 後的表達式，直到執行到 case 的表達式的值與 switch 的表達式的值相等時爲止。因爲對每一個 case 的匹配操做其實是 === 恆等運算符比較，而不是 == 相等運算符比較，所以，表達式和 case 的匹配並不會作任何類型轉換。編程語言

循環

while 語句

while 語句屬於前測試循環語句，也就是說，在循環體內的代碼被執行以前，就會對出口條件求值。因引，循環體內的代碼有可能永遠不會被執行。如下是 while 語句的語法：

while(expression) statement

下面是一個示例：

var i = 0;
while (i < 10) {
    i += 2;
}

do-while 語句

do-while 語句是一種後測試循環語句，即只有在循環體中的代碼執行以後，纔會測試出口條件。換句話說，在對條件表達式求值以前，循環體內的代碼至少會被執行一次。如下是 do-while 語句的語法：

do {
    statement
} while (expression);

下面是一個示例：

var i = 0;
do {
   i += 2;
} while (i < 10);

for 語句

for 語句也是一種前測試循環語句，但它具備在執行循環以前初始化變量和定義循環後要執行的代碼的能力。如下是 for 語句的語法：

for (initialization; expression; post-loop-expression) statement

下面是一個示例：

var count = 10;
for (var i = 0; i < count; i++){
    console.log(i);
}

這個 for 循環語句與下面的 while 語句的功能相同：

var count = 10;
var i = 0;
while (i < count){
    console.log(i);
    i++;
}

因爲 JavaScript 中不存在塊級做用域，所以在循環內部定義的變量也能夠在外部訪問到。例如：

var count = 10;
for (var i = 0; i < count; i++){
    console.log(i);
}
console.log(i); // 10

此外，for 語句中的初始化表達式、控制表達式和循環後表達式都是可選的。將這兩個表達式所有省略，就會建立一個無限循環，例如：

// 無限循環
for (;;) {
    doSomething();
}

for-in 語句

for-in 語句是一種精準的迭代語句，能夠用來枚舉對象的屬性。如下是 for-in 語句的語法：

for (property in object) statement

下面是一個示例：

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

在這個例子中，咱們使用 for-in 循環來顯示了 BOM 中 window 對象的全部屬性。每次執行循環時，都會將 window 對象中存在的一個屬性名賦值給變量 propName。這個過程會一直持續到對象中的全部屬性都被枚舉一遍爲止。與 for 語句相似，這裏控制語句中的 var 操做符也不是必需的。可是，爲了保證使用局部變量，咱們推薦上面例子中的這種作法。

JavaScript 對象的屬性沒有順序。所以，經過 for-in 循環輸出的屬性名的順序是不可預測的。具體來說，全部屬性都會被返回一次，但返回的前後次序可能會因瀏覽器而異。

若是表示要迭代的對象的變量值爲 null 或 undefined，for-in 語句會拋出錯誤。雖然 ECMAScript 5更正了這一行爲；對這種狀況再也不拋出錯誤，而只是不執行循環體。爲了保證最大限度的兼容性，建議在使用 for-in 循環以前，先檢測確認該對象的值不是 null 或 undefined。

跳轉

label 語句

使用 label 語句能夠在代碼中添加標籤，以便未來使用。如下是 label 語句的語法：

label: statement

下面是一個示例：

start: for (var i=0; i < count; i++) {
    console.log(i); 
}

這個例子中定義的 start 標籤能夠在未來由 break 或 continue 語句引用。加標籤的語句通常都要與 for 語句等循環語句配合使用。

break 和 continue 語句

break 和 continue 語句用於在循環中精確地控制代碼的執行。其中，break 語句會當即退出循環，強制繼續執行循環後面的語句。而 continue 語句雖然也是當即退出循環，但退出循環後會從循環的頂部繼續執行。請看下面的例子：

var num = 0;

for (var i=1; i < 10; i++) {
    if (i % 5 == 0) {
       break;
    }
    num++;
}

console.log(num);   // 4

這個例子中的 for 循環會將變量 i 由1遞增至 10。在循環體內，有一個 if 語句檢查 i 的值是否能夠被 5 整除（使用求模運算符）。若是是，則執行 break 語句退出循環。另外一方面，變量 num 從 0 開始，用於記錄循環執行的次數。在執行 break 語句以後，結果顯示 4。也就是說，在變量 i 等於 5 時，循環總共執行了 4 次；而 break 語句的執行，致使了循環在 num 再次遞增以前就退出了。若是在這裏把 break 替換爲 continue 的話，則能夠看到另外一種結果：

var num = 0;

for (var i=1; i < 10; i++) {
if (i % 5 == 0) {
        continue;
    }
    num++;
}

console.log(num);   // 8

例子的結果顯示 8，也就是循環總共執行了 8 次。當變量 i 等於 5 時，循環會在 num 再次遞增以前退出，但接下來執行的是下一次循環，即i的值等於 6 的循環。因而，循環又繼續執行，直到 i 等於 10 時天然結束。而 num 的最終值之因此是 8，是由於 continue 語句致使它少遞增了一次。

break 和 continue 語句均可以與 label 語句聯合使用，從而返回代碼中特定的位置。這種聯合使用的狀況多發生在循環嵌套的狀況下，以下面的例子所示：

var num = 0;

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

console.log(num);   // 55

在這個例子中，outermost 標籤表示外部的 for 語句。若是每一個循環正常執行 10 次，則 num++ 語句就會正常執行 100 次。換句話說，若是兩個循環都天然結束，num 的值應該是 100。但內部循環中的 break 語句帶了一個參數：要返回到的標籤。添加這個標籤的結果將致使 break 語句不只會退出內部的 for 語句（即便用變量 j 的循環），並且也會退出外部的 for 語句（即便用變量 i 的循環）。爲此，當變量 i 和 j 都等於 5 時， num的值正好是 55。一樣，continue 語句也能夠像這樣與 label 語句聯用，以下面的例子所示：

var num = 0;

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

console.log(num);   // 95

在這種狀況下，continue 語句會強制繼續執行循環，退出內部循環，執行外部循環。當 j 是 5 時，continue 語句執行，而這也就意味着內部循環少執行了 5 次，所以 num 的結果是 95。

雖然聯用 break、continue 和 label 語句可以執行復雜的操做，但若是使用過分，也會給調試帶來麻煩。在此，咱們建議若是使用 label 語句，必定要使用描述性的標籤，同時不要嵌套過多的循環。

return 語句

return 語句的做用是指定函數調用後的返回值。return 語句的語法以下：

return [expression];

下面是一個示例：

function square(x) { return x*x; }  // 一個包含 return 語句的函數
square(2);                          // 調用結果爲 4

return 語句只能在函數體內出現，若是不是的話會報語法錯誤。當執行到 return 語句的時候，函數終止執行，並返回 expression 的值給調用程序。若是沒有 return 語句，則函數調用僅依次執行函數體內的每一條語句直到函數結束，最後返回調用程序。這種狀況下，調用表達式的結果是 undefined。return 語句常常做爲函數內的最後一條語句出現，但並非說要必定放在函數最後。return 語句能夠單獨使用而沒必要帶有 expression，這樣的話函數也會向調用程序返回 undefined。

因爲 JavaScript 能夠自動插入分號，所以在 return 關鍵字和它後面的表達式之間不能有換行。

throw 語句

throw 語句的做用是把程序運行時產生的錯誤顯式地拋出異常。throw 語句的語法以下：

throw expression;

expression 的值能夠是任意類型的。能夠拋出一個表明錯誤碼的數字，或者包含可讀的錯誤消息的字符串。當 JavaScript 解釋器拋出異常的時候一般採用 Error 類型和其子類型。Error 對象有一個 name 屬性表示錯誤類型，一個 message 屬性用來存放傳遞給構造函數的字符串，在下面的例子中，當使用非法參數調用函數時就拋出一個 Error 對象：

function factorial(x) {
// 若是輸入參數是非法的，則拋出一個異常
    if (x < 0) throw new Error("x不能是負數");
    // 不然，計算出一個值，並正常地返回它
    for(var f = 1; x > 1; f *= x, x--) /* empty */ ;
    return f;
}

當拋出異常時，JavaScript 解釋器會當即中止當前正在執行的邏輯，並跳轉至就近的異常處理程序。若是沒有找到任何異常處理程序，異常就會沿着 JavaScript 方法的詞法結構和調用棧向上傳播。最終 JavaScript 將把異常當成程序錯誤來處理，並報告給用戶。

try 語句

try-catch-finally 語句是 JavaScript 中異常處理機制，try-catch-finally 語句的語法以下：

try {statement} [catch {handler statement}] [finally {cleaup statement}]

try 從句定義了須要處理的異常所在的代碼塊。catch 從句跟隨在 try 從句以後，當 try 塊內某處發生了異常時，調用 catch 內的代碼邏輯。catch 從句後跟隨 finally 塊，後者中放置清理代碼，無論 try 塊中是否產生異常，finally 塊內的邏輯老是會執行。儘管 catch 和 finally 都是可選的，但 try 從句須要至少兩者之一與之組成完整的語句。try、catch 和 finally 語句塊都須要使用花括號括起來，這裏的花括號是必需的，即便從句中只有一條語句也不能省略花括號。

下面的代碼詳細的說明了 try-catch-finally 的使用目的：

try {
    // 一般來說，這裏的代碼會從頭執行到尾而不會產生任何問題，
    // 但有時會拋出一個異常，要麼是由 throw 語句直接拋出異常，
    // 要麼是經過調用一個方法間接拋出異常
}
catch(e) {
    // 當且僅當 try 語句塊拋出了異常，纔會執行這裏的代碼
    // 這裏能夠經過局部變量 e 來得到對 Error 對象或者拋出的其餘值的引用
    // 這裏的代碼塊能夠基於某種緣由處理這個異常，也能夠忽略這個異常，
    // 還能夠經過 throw 語句從新拋出異常
}
finally {
    // 無論 try 語句塊是否拋出了異常，這裏的邏輯老是會執行，終止 try 語句塊的方式有：
    // 1）正常終止，執行完語句塊的最後一條語句
    // 2）經過 break、continue 或 return 語句終止
    // 3）拋出一個異常，異常被 catch 從句捕獲
    // 4）拋出一個異常，異常未被捕獲，繼續向上傳播
}

其餘

with 語句

with 語句的做用是將代碼的做用域設置到一個特定的對象中。with 語句的語法以下：

with (expression) statement;

定義 with 語句的目的主要是爲了簡化屢次編寫同一個對象的工做，以下面的例子所示：

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

上面幾行代碼都包含 location 對象。若是使用 with 語句，能夠把上面的代碼改寫成以下所示：

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

在這個重寫後的例子中，使用 with 語句關聯了 location 對象。這意味着在 with 語句的代碼塊內部，每一個變量首先被認爲是一個局部變量，而若是在局部環境中找不到該變量的定義，就會查詢 location 對象中是否有同名的屬性。若是發現了同名屬性，則以 location 對象屬性的值做爲變量的值。

因爲大量使用 with 語句會致使性能降低，同時也會給調試代碼形成困難，所以在開發大型應用程序時，不建議使用 with 語句。嚴格模式下不容許使用 with 語句，不然將視爲語法錯誤。

debugger 語句

debugger 語句一般什麼也不作。然而，當瀏覽器的調試工具可用並運行的時候，JavaScript 解釋器將會以調式模式運行。實際上，這條語句用來產生一個斷點（breakpoint），JavaScript 代碼的執行會中止在斷點的位置，這時可使用調試器輸出變量的值、檢查調用棧等。例如：

function f(o) {
    if (o === undefined) {
        debugger;  // 程序會中止在該位置
    }
    // 函數的其餘部分
}

use strict 語句

請參見「語法」-「嚴格模式」。

關卡

// 挑戰一
var k;
for(i=0, j=0; i<10, j<6; i++, j++){
    k = i + j;
}
console.log(k);  // ???
// 挑戰二
var nums = [12,32,54,56,78,89];
for(var n in nums){
    console.log(n);  // ???
}
// 挑戰三
function showCase(value) {
    switch (value) {
        case 'A':
            console.log('Case A');
            break;
        case 'B':
            console.log('Case B');
            break;
        case undefined:
            console.log('undefined');
            break;
        default:
            console.log('Do not know!');
    }
}
showCase(new String('A'));   // ???
// 挑戰四
function showCase(value) {
    switch (value) {
        case 'A':
            console.log('Case A');
        case 'B':
            console.log('Case B');
            break;
        case undefined:
            console.log('undefined');
            break;
        default:
            console.log('Do not know!');
    }
}
showCase(String('A'));   // ???
// 挑戰五
var i = 0;
for (;;) {
    if (i = 2) {
        continue;
    }
    if (i = 20) {
        break;
    }
    i++;
}
console.log(i);  // ???

更多

關注微信公衆號「劼哥舍」回覆「答案」，獲取關卡詳解。
關注 https://github.com/stone0090/javascript-lessons，獲取最新動態。

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程