詳解JavaScript中的流程語句

一 開篇概述

本講主要講解JavaScript流程語句，其大致內(nèi)容包括如下：

其中，常用的if,while,do..while,for在本片文章就不論述，重點(diǎn)論述for..in..,label,break和continue,whth，switch等語句

二 內(nèi)容區(qū)

（一）常用語句

由于如下語句比較通用，本篇文章就不再論述

1.條件語句

if語句

2.循環(huán)語句

while語句，do.while語句，for語句

（二） for..in..語句

1.定義

for...in...，是一種迭代語句，用來枚舉對象的屬性，其語法定義為：

for (propName in expression) statement

基于在JavaScript開發(fā)中"能使用局部變量，就不要使用全局變量"原則， 建議將propName屬性定義為局部變量，如下所示：

for (var propName in expression) statement

2.注意點(diǎn)

(1)for....in是用來枚舉對象屬性的，而不是枚舉對象屬性值。

例子1：

如下例子，for..in..輸出的是數(shù)組索引(即數(shù)組屬性)，而不是數(shù)組索引值。

var i = 5;
 var arr = new Array();

 for (var n = 0; n < i; n++) {
 arr[n] = i;
 }

 for (var propName in arr) {
 alert(propName);// 0,1,2,3,4
 }

例子2：

如下例子，for..in..輸出的是對象userInfo的屬性(name,age,address)，而不屬性值(Alan_beijing,38,china-shanghai)

var userInfo = { name: 'Alan_beijing', age: 38, address: 'china-shanghai' };
for (var property in userInfo) {
alert(property);//name,age,address5 
}

(2)for..in..枚舉屬性，沒有確定的順序，不同的瀏覽器，會有所差別。

(3)ECMAScript5版本之前，如果被迭代對象變量值null或undefined,for語句會拋出錯誤，ECMAScript5之后，這種情況不會拋出錯誤，但不執(zhí)行循環(huán)體。

（三） label

1.定義

在JavaScript中，label語句表示標(biāo)簽語句，通常與循環(huán)語句使用，表示循環(huán)語句跳轉(zhuǎn)到指定位置。

1 label:statement

例1：

如下代碼包含一個label語句outermost,其內(nèi)容為兩個嵌套的循環(huán)體，當(dāng)循環(huán)體執(zhí)行到1==5且j==5時，break語句將跳轉(zhuǎn)到outermost語句繼續(xù)執(zhí)行。

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++
 }
 }
 alert(num);//55

（四） break和continue

1.定義

break和continue都表示在循環(huán)體中，根據(jù)特定的條件退出循環(huán)體，但兩者又存在區(qū)別，break表示退出整個循環(huán)體，continue表示退出滿足條件的該次循環(huán)體。

例子1：

如下代碼，當(dāng)執(zhí)行i=5時，就退出整個循環(huán)體。

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

例子2：

如下代碼，當(dāng)執(zhí)行i=5時，退出本次循環(huán)，然后返回for語句開頭，繼續(xù)執(zhí)行。

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

2.注意點(diǎn)

(1)break和continue跳出循環(huán)體時，表示只跳出直接所在循環(huán)體，而不是除了直接循環(huán)體外的其他循環(huán)體。

例子1：

如下例子，break只跳出直接循環(huán)體

例子2：

如下例子，continue只跳出直接循環(huán)體

var num = 0;
 for (var i = 0; i < 10; i++) {
 for (var j = 0; j < 10; j++) {
 if (i == 5 && j == 5) {
 continue;
 }
 num++
 }
 }
 alert(num);//99

2.break和continue一般結(jié)合標(biāo)簽語句運(yùn)用，表示跳轉(zhuǎn)到指定位置

例子：

如下代碼，當(dāng)執(zhí)行到i=5 && j==5時，就跳到標(biāo)簽語句outermost處，繼續(xù)執(zhí)行。這里需要注意的是，JavaScrip沒有塊級作用域，因此在for語句外部是能夠訪問變量i的

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++
 }
 }

 alert(num);//55

（五） with

1.定義

with語句將代碼作用域設(shè)定到特定對象中，其主要目的是簡化多次編寫同一對象，提高復(fù)用。

1 with (expression) statement

例子：

如下代碼定義了一個獲取用戶信息函數(shù)，在函數(shù)體內(nèi)new了一個person對象，且定義兩個屬性(name和address)，然后將person對象with起來。

function GetUserInfo() {
 var person = new Object();
 person.name = "Alan_beijing";
 person.address = "China-shanghai";
 with (person) {
 return name +","+ address;
 }
 }
 alert(GetUserInfo());//Alan_beijing,China-shanghai

2.注意點(diǎn)

(1)在JavaScript開發(fā)中，慎用with語句，主要原因有二：其一是with語句影響性能；其二是with語句在嚴(yán)格模式下，會出錯

(2)with語句將公有對象括起來，從而提高代碼簡潔度和提高代碼復(fù)用性

(3)在執(zhí)行with語句體內(nèi)查找變量時，先看with體內(nèi)是否存在所查找變量，若不存在，再查找with括起來的變量是否有要查找的屬性。

如下例子更好地體現(xiàn)這一原則：

function GetUserInfo() {
 var person = new Object();
 person.name = "Alan_beijing";
 person.address = "China-shanghai";
 person.age = 35;
 with (person) {
 var sex = "男";
 var age = 40;
 return name + "," + sex + "," + age +","+ address;
 }
 }
 alert(GetUserInfo());//Alan_beijing,男,40,China-shanghai

（六） switch

1.定義

switch語句就是我們平時所說的開關(guān)語句，它非常適用于多條件情況。

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

例子：

如下代碼，根據(jù)城市名稱，查詢城市類別

//根據(jù)不同城市，判斷其屬于幾線城市
 function CityType(address) {
 switch (address) {
 case "Shanghai": alert("中國一線城市");
 break;
 case "Shenzhen": alert("中國一線城市");
 break;
 case "Beijing": alert("中國一線城市");
 break;
 default: alert("中國非一線城市");
 }
 }

 CityType("Shenzhen");//中國一線城市

2 注意點(diǎn)

(1)switch本質(zhì)與if是一樣的，都是解決多條件多分支問題；

(2)使用switch語句的真正目的是避免使用過多的if..else if ...else....語句；

三 總結(jié)

本篇文章主要結(jié)合代碼介紹了JavaScript的流程語句及其使用，重點(diǎn)結(jié)束了with,switch，for...in..,label,break和continue等語句，需要注意的是，在JavaScript中，流程語句都沒有塊級作用域，至于什么是塊級作用域，將在接下來的文章中與大家分享。

總結(jié)：

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com