5 基本陳述句

5.1 if 陳述句

? ? if 陳述句常用語法如下所示：

if (condition) {
  statement1;
}
else {
  statement2;
}

或

if (condition) {
  statement1;
}
else if {
  statement2;
}
else if {
  statement3;
}
else {
  statement4;
}

? ? 示例代碼如下所示：

let a=Math.round(Math.random()*100,0);
console.log("a value is:",a);
if (a<50){
    console.log("a小于50");
}
else if (a<70){
    console.log("a小于70");
}
else{
    console.log("沒有滿足條件");
}

5.2 while陳述句

5.2.1 do-while陳述句

? ? do-while陳述句是一種先運行后測驗的回圈陳述句，即回圈體里的代碼先執行，再對退出條件進行求值判斷，回圈體內的代碼至少要運行一次，其語法格式如下所示：

do{
  statement;
}
while (expression);

? ? 示例代碼如下所示：

let sum=0,i=1;
do{
    sum+=i;
    i++;
}
while(i<=100);
console.log("sum value is:",sum);

5.2.2 while陳述句

? ? while陳述句是一種先測驗再運行的回圈陳述句，即先對退出條件進行求值，再執行回圈體里面的代碼，因此，在while回圈內的代碼可能不會執行，其語法格式如下所示：

let sum=0,i=1;
while(i<=100){
    sum+=i;
    i++;
}
console.log("sum value is:",sum);

5.3 for陳述句

5.3.1 for陳述句

? ? for陳述句也是先測驗陳述句，再執行回圈體內的代碼，但在進入回圈之前加入了初始化代碼及回圈執行后要執行的運算式，其語法格式如下所示：

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

在使用for回圈，避免死回圈

? ? 示例代碼如下所示：

let sum=0;
for(let i=0;i<=100;i++){
    sum+=i;
}
console.log("sum value is:",sum);

5.3.2 for-in陳述句

? ? for-in陳述句是一種嚴格的迭代陳述句，用于列舉物件中的非符號鍵屬性，其語法如下：

for (property in expression) {
  statement
}

果for-in回圈要迭代的變數是null 或undefined，則不執行回圈體

? ? 示例代碼如下所示：

let personInfo={
    "name":"Surpass",
    "age":28,
    "location":"Shanghai",
    "from":"Wuhan"
};
for (let item in personInfo){
    console.log("key is: "+item+" value is:"+personInfo[item]);
}

let personInfoArray=["Surpass",28,"Shanghai","Wuhan"];
for(let item in personInfoArray){
    console.log("item is:",personInfoArray[item]);
}

輸出結果如下所示：

key is: name value is:Surpass
key is: age value is:28
key is: location value is:Shanghai
key is: from value is:Wuhan
item is: Surpass
item is: 28
item is: Shanghai
item is: Wuhan

5.3.3 for-of 陳述句

? ? for-of 陳述句是一種嚴格的迭代陳述句，用于遍歷可迭代物件的元素，其語法如下：

for (property of expression) {
  statement
}

? ? 示例代碼如下所示：

let personInfoArray=["Surpass",28,"Shanghai","Wuhan"];
for(let item of personInfoArray){
    console.log("item is:",item);
}

輸出結果如下所示：

item is: Surpass
item is: 28
item is: Shanghai
item is: Wuhan

5.4 中斷陳述句

? ? 在JavaScript中常用的中斷陳述句有兩個break和continue，其主要區別如下所示：

• break:中斷整個回圈，即立即退出回圈
• continue:中斷本次回圈，即此次回圈中斷，后續若還有回圈，則繼續下一次回圈，

5.4.1 break 陳述句

? ? break陳述句用于中斷整個回圈，即立即退出回圈，示例代碼如下所示：

for(let i=0;i<=5;i++){
    if (i %2 == 1){
        break;
    }
    console.log("current value is:",i);
}

輸出結果如下所示：

current value is: 0

5.4.2 continue 陳述句

? ? continue陳述句用于中斷本次回圈，即此次回圈中斷，后續若還有回圈，則繼續下一次回圈，示例代碼如下所示：

for(let i=0;i<=5;i++){
    if (i %2 == 1){
        continue;
    }
    console.log("current value is:",i);
}

輸出結果如下所示：

current value is: 0
current value is: 2
current value is: 4

5.5 with 陳述句

? ? with 陳述句的主要場景是針對一個物件反復操作，這時候將代碼作用域設定為該物件能提供便利，其基本語法如下所示：

with (expression) {
 statement;
}

? ? 示例代碼如下所示：

// 未使用with陳述句
let personInfo={
        "name":"Surpass",
        "age":28,
        "location":"Shanghai",
        "from":"Wuhan"
    };

let getName=personInfo.name,getAge=personInfo.age,getLocation=personInfo.location,getFrom=personInfo.from;
console.log(getName,getAge,getLocation,getFrom);

// 使用with陳述句
with(personInfo){
    let getName=name,getAge=age,getLocation=location,getFrom=from;
    console.log(getName,getAge,getLocation,getFrom);
}

輸出結果如下所示：

Surpass 28 Shanghai Wuhan
Surpass 28 Shanghai Wuhan

由于with 陳述句影響性能且難于除錯其中的代碼，通常不推薦在產品代碼中使用with陳述句

5.6 swithch陳述句

? ? switch 陳述句是與if 陳述句緊密相關的一種流控制陳述句，其語法格式如下所示：

switch (expression) {
    case value1:
    	statement
    	break;
    case value2:
    	statement
    	break;
    case value3:
        statement
        break;
    case value4:
        statement
        break;
    default:
    	statement
}

break關鍵字會導致代碼執行跳出switch陳述句，如果沒有break，則代碼會繼續匹配下一個條件，default關鍵字用于在任何條件都沒有滿足時指定默認執行的陳述句，

let i=30;
switch (i) {
    case 10:
        console.log("i=",10);
        break;
    case 20:
        console.log("i=",20);
        break;
    case 30:
        console.log("i=",30);
        // break;
    case 40:
        console.log("i=",40);
        // break;
    default:
        console.log("i=",NaN)
        break;
}

輸出結果如下所示：

i= 30
i= 40
i= NaN

? ? switch陳述句可以用于所有資料型別，因此可以使用字串甚至物件，其次，條件的值不需要是常量，可以是變數或運算式，示例如下所示：

switch ("Hi Surpass") {
    case "Hi"+" Surpass":
        console.log("Hi Surpass");
        break;
    case "Hi"+ " Kevin":
        console.log("Hi Kevin");
        break;
    default:
        console.log("Not Found");
        break;
}

或

let flag=true;
let number=18;
switch (flag) {
    case number<10:
        console.log("number < 10");
        break;
    case number >=10 && number <20:
        console.log("10<=number<20");
        break;
    case number >=20 && number <30:
        console.log("20<=number<30");
        break;
    default:
        console.log("number >=30");
        break;
}

原文地址：https://www.jianshu.com/p/8223c6aa5b96

本文同步在微信訂閱號上發布，如各位小伙伴們喜歡我的文章，也可以關注我的微信訂閱號：woaitest，或掃描下面的二維碼添加關注：

作者： Surpassme

來源： http://www.jianshu.com/u/28161b7c9995/

http://www.cnblogs.com/surpassme/

宣告：本文著作權歸作者所有，歡迎轉載，但未經作者同意必須保留此段宣告，且在文章頁面明顯位置給出 原文鏈接 ，否則保留追究法律責任的權利，如有問題，可發送郵件 聯系，讓我們尊重原創者著作權，共同營造良好的IT朋友圈，

標籤：其他

上一篇：【全網最全】2022最新版前端 -- 面試題

下一篇：Vue3 和 Vue2 的異同及開發中具體區別