JavaScript中的那些語句

前言

基本上，咱們天天都在和 JavaScript 中的各類語句進行着 溝通 ，那些咱們常常見面的 老朋友，或者是不曾見面的 新朋友 ，它們共同維護着 JavaScript 的流程，讓咱們的程序穩步運行。那麼，你是否對它們足夠了解呢

若是文章中有出現紕漏、錯誤之處，還請看到的小夥伴多多指教，先行謝過

如下↓

JavaScript 區分表達式和語句。表達式是輸出值的，而且能夠寫在任何須要一個值的地方.籠統來講，一個語句表示執行了一個動做

條件語句

if語句

語法：

if (condition) statement1 else statement2

   // condition 值爲真或假的表達式
   // statement1 當 condition 爲真時執行的語句
   // statement2 當 condition 爲假時執行的語句

if 語句大概是咱們接觸特別多的條件語句了，根據不一樣的判斷條件執行不一樣的邏輯

多層 if...else 語句可以使用 else if 從句

if (condition1)
   statement1
else if (condition2)
   statement2
...
else
   statementN

switch語句

switch 語句評估一個表達式，將表達式的值與 case 子句匹配，並執行與該狀況相關聯的語句

語法：

switch (expression) {
  case value1:
  // 代碼塊
  break;
  case value2:
  // 代碼塊
  ...
  
  default 
  // 代碼塊
}

switch 在比較值時，使用的是全等操做符 === ，所以不會發生類型轉換

若是多個 case 與提供的值匹配，則選擇匹配的第一個 case

若是沒有 case 子句相匹配，程序則會尋找那個可選的 default 子句，若是找到了，將控制權交給它，執行相關語句;若沒有就執行完 switch 語句

若 break 被省略，程序會繼續執行 switch 語句中的下一條語句

迭代語句

do-while語句

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

語法：

do {
    statement
} while(expression)

while語句

while 語句屬於前測試循環語句，即在循環體內的代碼被執行以前，就會測試出口條件

語法：

while(expression) statement

當測試條件一直爲真的狀況下，就會造成一個死循環。因此在執行階段，咱們頗有必要爲循環設定結束條件

for語句

for 語句也是前測試循環語句,它具備執行循環以前初始化變量和定義循環後要執行的代碼的能力

示例：

var count = 10;
for(var i = 1; i < count; i++){
    // 代碼塊
}

for 循環的執行順序是 變量賦值==>判斷條件==> (符合就執行代碼塊，再執行 ++ 操做) == (不符合就直接跳出循環)

使用 while 循環作不到的，使用 for 循環一樣也作不到， for 循環只是把與循環有關的代碼集中在了一個地方

for-in語句

for-in 語句是一種精準的迭代語句，用來枚舉對象的屬性

語法：

for (variable in object) {...}

for...in 循環只遍歷可枚舉屬性

for..in 循環輸出的屬性名的順序是不可預測的。具體來說，全部屬性都會被返回一次，但返回的前後次序可能會因瀏覽器而異

for...in 會遍歷存在於原型對象的可枚舉屬性

for..in 不適合遍歷數組 數組的屬性就是它的索引

for-of語句

for...of 是 ES6 新增的迭代方式，規定了一個數據結構只要部署了 Symbol.iterator 屬性，就被視爲具備 iterator 接口，就能夠用 for...of 循環遍歷它的成員,它的出現就是在必定程度上補充了 for...in 的不足

語法：

for (variable of object) {...}

具體能夠 點擊這裏

for...in 與 for...of 的區別

其餘

break和continue語句

break 和 continue 語句用於在循環中精確地控制代碼的執行

break 語句會當即退出循環，強制執行循環後面的語句；continue 語句雖然也是當即退出循環，可是退出循環後會從循環的底部繼續執行

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

num // 4

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

num // 8

label語句

使用 label 語句能夠在代碼中添加標籤，以便未來使用

語法：

label: statement

label 語句通常都會配合 break 和 continue 使用，多用於多重循環

var count = 0;
loop1: 
for(var i = 0; i < 10; i++) {
    loop2:
    for(var j = 0; j < 10; j++) {
        if (i == 5 && j == 5) {
         continue loop1;
      }
      count++
    }
}

count // 95

// 不使用 label 語句的狀況下會從裏面的循環從新開始，使用 label 標識會從標識的循環從新開始

with語句

with 語句的做用是將代碼的做用域設置到一個特定的對象中，主要目的是爲了簡化屢次編寫同一個對象的操做

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

// 改寫以下

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

// 使用 with 語句關聯了 location 對象

嚴格模式下不容許使用 with 語句

with會延長做用域

大量使用 with 語句會形成程序性能降低

debugger語句

debugger 語句，用來產生一個斷點，代碼的執行會停在斷點的位置，這時使用調試器來輸出變量的值

空語句

語法：

;

通常狀況下，空語句會配合 for 循環來使用

for(;;;){
    // 產生一個死循環
}

後記

固然，在 JavaScript 中還有其餘的一些語句，好比聲明語句、複合語句等。瞭解它們的用法，咱們就能在合適的場景去更好地使用它們，讓咱們的代碼更加優雅

若是你也是一個前端愛好者，若是你也想了解、分享更多前端的技能和有趣的東西，點擊這裏 你將看到更多分享，歡迎 star 關注

期待同行

以上