No.21 JavaScript流程控制

一、if 語句

語法結(jié)構(gòu):
// 條件成立執(zhí)行代碼,否則什么也不做
if (條件表達(dá)式) {
// 條件成立執(zhí)行的代碼語句
}

var usrAge = prompt('請輸入您的年齡:');
if(usrAge >= 18){
    alert('您已成年!');
}

二、if else語句(雙分支語句)

語法結(jié)構(gòu):
// 條件成立 執(zhí)行 if 里面代碼,否則執(zhí)行else 里面的代碼
if (條件表達(dá)式) {
// [如果] 條件成立執(zhí)行的代碼
} else {
// [否則] 執(zhí)行的代碼
}

if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
    alert("這個年份是閏年");
} else { // 剩下的是平年
    alert("這個年份是平年");
}

三、if else if 語句(多分支語句)

語法結(jié)構(gòu):
// 適合于檢查多重條件。
if (條件表達(dá)式1) {
語句1;
} else if (條件表達(dá)式2) {
語句2;
} else if (條件表達(dá)式3) {
語句3;
....
} else {
// 上述條件都不成立執(zhí)行此處代碼
}

var score = prompt('請您輸入分?jǐn)?shù):');
if (score >= 90) {
    alert('A');
} else if (score >= 80) {
    alert('B');
} else if (score >= 70) {
    alert('C');
} else if (score >= 60) {
    alert('D');
} else {
    alert('E');

四、三元表達(dá)式

三元表達(dá)式也能做一些簡單的條件選擇。 由三元運算符組成的式子稱為三元表達(dá)式。
語法結(jié)構(gòu):
表達(dá)式1 ? 表達(dá)式2 : 表達(dá)式3;
執(zhí)行思路 :
如果表達(dá)式1為 true ,則返回表達(dá)式2的值,如果表達(dá)式1為 false,則返回表達(dá)式3的值;
簡單理解: 就類似于 if else (雙分支) 的簡寫;

var time = prompt('請您輸入一個 0 ~ 59 之間的一個數(shù)字');
var result = time < 10 ? '0' + time : time; // 把返回值賦值給一個變量
alert(result);

五、分支流程控制 switch 語句

語法結(jié)構(gòu):
switch :開關(guān) 轉(zhuǎn)換 , case :小例子 選項
關(guān)鍵字 switch 后面括號內(nèi)可以是表達(dá)式或值, 通常是一個變量
關(guān)鍵字 case , 后跟一個選項的表達(dá)式或值,后面跟一個冒號
switch 表達(dá)式的值會與結(jié)構(gòu)中的 case 的值做比較
如果存在匹配全等(===) ,則與該 case 關(guān)聯(lián)的代碼塊會被執(zhí)行,并在遇到 break 時停止,整個 switch 語句代碼執(zhí)行結(jié)束
如果所有的 case 的值都和表達(dá)式的值不匹配,則執(zhí)行 default 里的代碼

注意: 執(zhí)行case 里面的語句時,如果沒有break,則繼續(xù)執(zhí)行下一個case里面的語句。

var fruit = prompt('請您輸入查詢的水果:');
switch (fruit) {
    case '蘋果':
        alert('蘋果的價格是 3.5/斤');
        break;
    case '榴蓮':
        alert('榴蓮的價格是 35/斤');
        break;
    default:
        alert('沒有此水果');
}

switch 語句和 if else if 語句的區(qū)別:
一般情況下,它們兩個語句可以相互替換
switch...case 語句通常處理 case為比較確定值的情況, 而 if…else…語句更加靈活,常用于范圍判斷(大于、等于某個范圍)
switch 語句進(jìn)行條件判斷后直接執(zhí)行到程序的條件語句,效率更高。而if…else 語句有幾種條件,就得判斷多少次。
當(dāng)分支比較少時,if… else語句的執(zhí)行效率比 switch語句高。
當(dāng)分支比較多時,switch語句的執(zhí)行效率比較高,而且結(jié)構(gòu)更清晰。

六、for 循環(huán)

語法結(jié)構(gòu):
for(初始化變量; 條件表達(dá)式; 操作表達(dá)式 ){
//循環(huán)體
}
for 循環(huán)主要用于把某些代碼循環(huán)若干次,通常跟計數(shù)有關(guān)系。

初始化變量:通常被用于初始化一個計數(shù)器,該表達(dá)式可以使用 var 關(guān)鍵字聲明新的變量,這個變量幫我們來記錄次數(shù)。
條件表達(dá)式:用于確定每一次循環(huán)是否能被執(zhí)行。如果結(jié)果是 true 就繼續(xù)循環(huán),否則退出循環(huán)。
操作表達(dá)式:每次循環(huán)的最后都要執(zhí)行的表達(dá)式。通常被用于更新或者遞增計數(shù)器變量。當(dāng)然,遞減變量也是可以的。

執(zhí)行過程:

  1. 初始化變量,初始化操作在整個 for 循環(huán)只會執(zhí)行一次。
  2. 執(zhí)行條件表達(dá)式,如果為true,則執(zhí)行循環(huán)體語句,否則退出循環(huán),循環(huán)結(jié)束。
  3. 執(zhí)行操作表達(dá)式,此時第一輪結(jié)束。
  4. 第二輪開始,直接去執(zhí)行條件表達(dá)式(不再初始化變量),如果為 true ,則去執(zhí)行循環(huán)體語句,否則退出循環(huán)。
  5. 繼續(xù)執(zhí)行操作表達(dá)式,第二輪結(jié)束。
  6. 后續(xù)跟第二輪一致,直至條件表達(dá)式為假,結(jié)束整個 for 循環(huán)。
for(var i = 1; i <= 2020; i++){
    console.log('Hello World!');
}

七、while 循環(huán)

語法結(jié)構(gòu):
while (條件表達(dá)式) {
// 循環(huán)體代碼
}

while 語句可以在條件表達(dá)式為真的前提下,循環(huán)執(zhí)行指定的一段代碼,直到表達(dá)式不為真時結(jié)束循環(huán)。

執(zhí)行思路:
先執(zhí)行條件表達(dá)式,如果結(jié)果為 true,則執(zhí)行循環(huán)體代碼;如果為 false,則退出循環(huán),執(zhí)行后面代碼;
執(zhí)行循環(huán)體代碼;
循環(huán)體代碼執(zhí)行完畢后,程序會繼續(xù)判斷執(zhí)行條件表達(dá)式,如條件仍為true,則會繼續(xù)執(zhí)行循環(huán)體,直到循環(huán)條件為 false 時,整個循環(huán)過程才會結(jié)束;

var num = 1;
while (num <= 2020) {
    console.log('Hello World!');
    num++;
}

注意:
使用 while 循環(huán)時一定要注意,它必須要有退出條件,否則會成為死循環(huán);
while 循環(huán)和 for 循環(huán)的不同之處在于 while 循環(huán)可以做較為復(fù)雜的條件判斷,比如判斷用戶名和密碼;

八、do while 循環(huán)

語法結(jié)構(gòu):
do {
// 循環(huán)體代碼 - 條件表達(dá)式為 true 時重復(fù)執(zhí)行循環(huán)體代碼
} while(條件表達(dá)式);

do... while 語句其實是 while 語句的一個變體。該循環(huán)會先執(zhí)行一次代碼塊,然后對條件表達(dá)式進(jìn)行判斷,如果條件為真,就會重復(fù)執(zhí)行循環(huán)體,否則退出循環(huán)。

執(zhí)行思路:
先執(zhí)行一次循環(huán)體代碼;
再執(zhí)行條件表達(dá)式,如果結(jié)果為 true,則繼續(xù)執(zhí)行循環(huán)體代碼,如果為 false,則退出循環(huán),繼續(xù)執(zhí)行后面代碼;

do {
  var motivation = prompt('你想學(xué)習(xí)嗎?');
} while (motivation != '我愛學(xué)習(xí)')
alert('開始學(xué)習(xí)吧');

注意:
先再執(zhí)行循環(huán)體,再判斷,我們會發(fā)現(xiàn) do…while 循環(huán)語句至少會執(zhí)行一次循環(huán)體代碼;

九、continue break

continue 關(guān)鍵字用于立即跳出本次循環(huán),繼續(xù)下一次循環(huán)(本次循環(huán)體中 continue 之后的代碼就會少執(zhí)行一次)。
例如,吃5個包子,第3個有蟲子,就扔掉第3個,繼續(xù)吃第4個第5個包子。

for (var i = 1; i <= 5; i++) {
    if (i == 3) {
        console.log('這個包子有蟲子,扔掉');
        continue; // 跳出本次循環(huán),跳出的是第3次循環(huán) 
    }
    console.log('我正在吃第' + i + '個包子呢');
 }



break 關(guān)鍵字用于立即跳出整個循環(huán)(循環(huán)結(jié)束)。
例如,吃5個包子,吃到第3個發(fā)現(xiàn)里面有半個蟲子,其余的不吃了。

for (var i = 1; i <= 5; i++) {
    if (i == 3) {
        break; // 直接退出整個for 循環(huán),跳到整個for下面的語句
    }
    console.log('我正在吃第' + i + '個包子呢');
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容