初學JavaScript之分支或判斷語句

體上程序代碼的執行是從上到下順序執行，在某些具體階段可以會產生分支和循環重復的情形，形成了各種不同的程序語句，構成了不同的程序結構。主要有順序結構，分支結構和循環結構。以前的代碼主要是按程序的順序執行，以后的代碼會是這三者的不同組合。

分支語句

1 語句

如果說表達式（例如：num1+num2）是短語。

語句就是完整的句子。（例如：sum=num1+num2;）

表達式計算出來的是一個值，語句來執行使某事情發生。

例如：給一個學生的年齡，輸出這個學生是否成年了。

如果年齡大于等于18歲輸出學生成年了。

這里的成年了是否會輸出是有年齡是否滿足決定的。

JS在默認的就是從上到下一條條的執行代碼語句。

為使某事發生可能會改變語句的默認執行順序。

2 if語句

格式：if（條件）{

條件為真實執行的語句

}

JS解釋器會根據條件的結果決定是執行還是跳過語句。

讀法：如果條件為真，執行里面的代碼。為假掉過里面的代碼。

//實踐：給一個學生的年齡，輸出這個學生是否成年了。
//var age1=parseInt(prompt("請輸入一個學生的年齡："));
 var age1=23;
 if(age1>=18){
    console.log("這個學生成年了。");
 }
 if(age1<18){
    console.log("這個學生沒有成年。");
 }

分析一下，這里的判斷是一個事情的兩個方面？

3 if-else語句

格式：

if（條件）{條件為真，執行的語句}

else{條件為假（不為真），執行的語句。}

讀法：如果條件為真執行為真的語句，否則執行為假的語句

//實踐：給一個學生的年齡，輸出這個學生是否成年了。
// var age2=parseInt(prompt("請輸入一個學生的年齡："));
var age2=16;
if(age2>=18){
console.log("這個學生成年了。");
}
else{
console.log("這個學生沒有成年。");
}

如果判斷學生的成績等級，會有很多的判斷。

4 if-else if語句

格式：

if（條件1）{為真，執行的語句}

else if（條件2）{為真，執行的語句}

......

else if(條件n){為真，執行的語句}

else{ 條件n為假，執行的語句 }

//實踐：根據學生的成績，判定學生的等級
//var score1=parseFloat(prompt("請輸入一個學生的成績："));
var score1=95;
if(score1>=90){console.log("A");}
else if(score1>=80){console.log("B");}
else if(score1>=70){console.log("C");}
else if(score1>=60){console.log("D");}
else{console.log("E");}

5 switch語句

它是if語句的另外一種形式，解決根據表達式的不同而執行不同語句的問題。

格式：

switch(表達式){

case 值1：語句塊；break；

case 值2：語句塊；break；

......

case 值n：語句塊；break；

default：語句塊n+1；break;

}

執行：

計算一次 switch 表達式

每個表達式的值與每個 case 的值進行對比

如果存在匹配，則執行關聯代碼

default：關鍵詞規定不存在 case 匹配時所運行的代碼。

break：如果 JavaScript 遇到 break 關鍵詞，它會跳出 switch 代碼塊。

//實踐：重寫根據學生的成績，判定學生的等級
//var score2=parseInt(prompt("請輸入一個學生的成績："));
var score2=90;
score2=parseInt(score2/10);//parseInt()取得整數部分。
switch(score2){
case 10:console.log("A");break;
case 9:console.log("A");break;
case 8:console.log("B");break;
case 7:console.log("C");break;
case 6:console.log("D");break;
default:console.log("E");break;}

6 三元運算符

可以當成一種簡單的if-else語句。

名字表示的三元運算符需要三個操作數。

語法是：

條件 ? 結果1 : 結果2;

這里你把條件寫在問號上(?)的前面后面跟著用冒號(:)分隔的結果1和結果2。

滿足條件時結果1否則結果2。

JavaScript中，有多種方法可以判斷一個變量的數據類型。以下是一些常見的方法：

typeof 操作符

typeof 是JavaScript中的一元操作符，返回一個表示未計算變量類型或已計算對象類型的字符串。但是，需要注意的是 typeof 對于 null 和 array 的處理可能不是你所期望的：

console.log(typeof undefined);    // "undefined"  
console.log(typeof 123);          // "number"  
console.log(typeof 'hello');      // "string"  
console.log(typeof true);         // "boolean"  
console.log(typeof {});           // "object"  
console.log(typeof []);           // "object" 而不是 "array"  
console.log(typeof null);         // "object" 而不是 "null"  
console.log(typeof function(){}); // "function"

instanceof 操作符

instanceof 操作符用于檢測構造函數的 prototype 屬性是否出現在對象的原型鏈中的任何位置。這主要用于檢測對象是否屬于某個類。

console.log([] instanceof Array);  // true  
console.log(null instanceof Object); // false，因為 null 不是一個對象

Array.isArray() 方法

這是檢測一個值是否為數組的最佳方法。

console.log(Array.isArray([]));  // true  
console.log(Array.isArray({}));  // false

Object.prototype.toString.call() 方法

這個方法返回表示該對象的字符串。對于檢測原始值類型，特別是當 typeof 給出不直觀的結果時（如 null 和 array），這是一個很有用的方法。

function getType(obj) {  
    return Object.prototype.toString.call(obj).slice(8, -1);  
}  
  
console.log(getType(null));       // "Null"  
console.log(getType([]));         // "Array"  
console.log(getType({}));         // "Object"  
console.log(getType(123));        // "Number"  
console.log(getType('hello'));    // "String"  
console.log(getType(true));       // "Boolean"  
console.log(getType(undefined));  // "Undefined"

constructor 屬性

每個JavaScript對象都有一個 constructor 屬性，它指向創建該對象的構造函數。但請注意，如果 constructor 被手動修改，則可能不準確。

console.log(([]).constructor === Array);  // true  
console.log(({}).constructor === Object); // true

ES6 中的 Symbol.toStringTag

某些內置對象（如 Array、Date、RegExp 等）的 @@toStringTag 屬性值是一個字符串，該字符串用于定制 Object.prototype.toString.call(obj) 的默認行為。但通常你不需要直接使用這個屬性，除非你在實現自定義對象并希望改變 Object.prototype.toString.call(obj) 的默認行為。

篇文章給大家繼續講解下js中的多種語句。今天主要說下以下4個語句。

（1）for in語句

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

使用語法：for (property in expression) statement

請看下面的例子。假設我們有一個數組，我們想要求數組內各元素的和，那么我們可以這么寫；

在這個例子中，我們使用 for-in 循環來循環獲取arr數組中的每個元素。每次執行循環時，都會將數組中的值添加到sum中。這個過程會一直持續到數組中的所有元素都被枚舉一遍為止。

（2）label語句

使用 label 語句可以在代碼中添加標簽，以便將來使用。

使用語法：label: statement

請看下面的例子。

這個例子中定義的 start 標簽可以在將來由 break 或 continue 語句引用。加標簽的語句一般都要與 for 語句等循環語句配合使用。

（3）break和continue語句

break 和 continue 語句用于在循環中精確地控制代碼的執行。其中，break 語句會立即退出循環，強制繼續執行循環后面的語句。而 continue 語句雖然也是立即退出循環，但退出循環后會從循環的頂

部繼續執行。

請看下面的例子：我們從1開始執行，如果i的值能整除5的話就跳出循環；

這個例子中的 for 循環會將變量 i 由 1 遞增至 10。在循環體內，有一個 if 語句檢查 i 的值是否可以被 5 整除（使用求模操作符）。如果是，則執行 break 語句退出循環。另一方面，變量 num 從 0 開

始，用于記錄循環執行的次數。在執行 break 語句之后，要執行的下一行代碼是 alert()函數，結果顯示 4。也就是說，在變量 i 等于 5 時，循環總共執行了 4 次；而 break 語句的執行，導致了循環在

num 再次遞增之前就退出了。

如果在這里把 break 替換為 continue 的話，代碼就如下圖所示：

當變量 i 等于 5 時，循環會在 num 再次遞增之前退出，但接下來執行的是下一次循環，即 i 的值等于 6 的循環。于是，循環又繼續執行，直到 i 等于10 時自然結束。而 num 的最終值之所以是 8，是因為 continue 語句導致它少遞增了一次；

（4）with語句

with 語句的作用是將代碼的作用域設置到一個特定的對象中。

使用語法：with (expression) statement;

定義 with 語句的目的主要是為了簡化多次編寫同一個對象的工作，如下面的例子所示：

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

注意：由于大量使用 with 語句會導致性能下降，同時也會給調試代碼造成困難，因此在開發大型應用程序時，不建議使用 with 語句，大家這里了解下即可。

（5）switch 語句

switch 語句與 if 語句的關系最為密切，而且也是在其他語言中普遍使用的一種流控制語句。

使用語法：

、

請看下面的例子：我們比如小明考試考了82分，我們這里如果是得分0-60為不及格，61-80為一般，81-100為優秀，那么小明的成績屬于什么區間呢。

我們這里顯然會彈出優秀彈窗。

每日金句：真正的堅韌，應該是哭的時候要徹底，笑的時候要開懷，說的時候要淋漓盡致，做的時候要毫不猶豫。喜歡我的文章的小伙伴記得關注一下哦，每天將為你更新最新知識。

在線咨詢

上一篇：HTML5 文件上傳下載的實例代碼
下一篇：HTML 文件路徑

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商