【詳解JavaScript系列】JavaScript之流程語句
一 開篇概述
本講主要講解JavaScript流程語句，其大致內容包括如下：
其中，常用的if,while,do..while,for在本片文章就不論述，重點論述for..in..,label,break和continue,whth，switch等語句
二 內容區
（一）常用語句
由於如下語句比較通用，本篇文章就不再論述
1.條件語句
if
2.迴圈語句
while,do..while,for
（二） for..in..語句
1.定義
for...in...，是一種迭代語句，用來列舉物件的屬性，其語法定義為：
1 for (propName in expression) statement
基於在JavaScript開發中"能使用區域性變數，就不要使用全域性變數"原則， 建議將propName屬性定義為區域性變數，如下所示：
1 for (var propName in expression) statement
2.注意點
(1)for....in是用來列舉物件屬性的，而不是列舉物件屬性值。
例子1：
如下例子，for..in..輸出的是陣列索引(即陣列屬性)，而不是陣列索引值。
1var i = 5;
2var arr = new Array();
3
4for (var n = 0; n < i; n++) {
5arr[n] = i;
6}
7
8for (var propName in arr) {
9alert(propName);// 0,1,2,3,4
10}
例子2：
如下例子，for..in..輸出的是物件userInfo的屬性(name,age,address)，而不屬性值(Alan_beijing,38,china-shanghai)
1var userInfo = { name: 'Alan_beijing', age: 38, address: 'china-shanghai' };
2
3for (var property in userInfo) {
4alert(property);//name,age,address
5}
(2)for..in..列舉屬性，沒有確定的順序，不同的瀏覽器，會有所差別。
(3)ECMAScript5版本之前，如果被迭代物件變數值null或undefined,for語句會丟擲錯誤，ECMAScript5之後，這種情況不會丟擲錯誤，但不執行迴圈體。
（三） label
1.定義
在JavaScript中，label語句表示標籤語句，通常與迴圈語句使用，表示迴圈語句跳轉到指定位置。
1 label:statement
例1：
如下程式碼包含一個label語句outermost,其內容為兩個巢狀的迴圈體，當迴圈體執行到1==5且j==5時，break語句將跳轉到outermost語句繼續執行。
1var num = 0;
2outermost:
3for (var i = 0; i < 10; i++) {
4for (var j = 0; j < 10; j++) {
5if (i == 5 && j == 5) {
6break outermost;
7}
8num++
9}
10}
11
12alert(num);//55
（四） break和continue
1.定義
break和continue都表示在迴圈體中，根據特定的條件退出迴圈體，但兩者又存在區別，break表示退出整個迴圈體，continue表示退出滿足條件的該次迴圈體。
例子1：
如下程式碼，當執行i=5時，就退出整個迴圈體。
1var num = 1;
2for (var i = 1; i < 10; i++) {
3if (i % 5 == 0) {
4break;
5}
6num++;
7}
8alert(num);//5
例子2：
如下程式碼，當執行i=5時，退出本次迴圈，然後返回for語句開頭，繼續執行。
1var num = 1;
2for (var i = 1; i < 10; i++) {
3if (i % 5 == 0) {
4continue;
5}
6num++;
7}
8alert(num);//9
2.注意點
(1)break和continue跳出迴圈體時，表示只跳出直接所在迴圈體，而不是除了直接迴圈體外的其他迴圈體。
例子1：
如下例子，break只跳出直接迴圈體
例子2：
如下例子，continue只跳出直接迴圈體
1var num = 0;
2for (var i = 0; i < 10; i++) {
3for (var j = 0; j < 10; j++) {
4if (i == 5 && j == 5) {
5continue;
6}
7num++
8}
9}
10
11alert(num);//99
2.break和continue一般結合標籤語句運用，表示跳轉到指定位置
例子：
如下程式碼，當執行到i=5 && j==5時，就跳到標籤語句outermost處，繼續執行。這裡需要注意的是，JavaScrip沒有塊級作用域，因此在for語句外部是能夠訪問變數i的
1var num = 0;
2outermost:
3for (var i = 0; i < 10; i++) {
4for (var j = 0; j < 10; j++) {
5if (i == 5 && j == 5) {
6break outermost;
7}
8num++
9}
10}
11
12alert(num);//55
（五） with
1.定義
with語句將程式碼作用域設定到特定物件中，其主要目的是簡化多次編寫同一物件，提高複用。
1 with (expression) statement
例子：
如下程式碼定義了一個獲取使用者資訊函式，在函式體內new了一個person物件，且定義兩個屬性(name和address)，然後將person物件with起來。
1function GetUserInfo() {
2var person = new Object();
3person.name = "Alan_beijing";
4person.address = "China-shanghai";
5with (person) {
6return name +","+ address;
7}
8}
9
10alert(GetUserInfo());//Alan_beijing,China-shanghai
2.注意點
(1)在JavaScript開發中，慎用with語句，主要原因有二：其一是with語句影響效能；其二是with語句在嚴格模式下，會出錯
(2)with語句將公有物件括起來，從而提高程式碼簡潔度和提高程式碼複用性
(3)在執行with語句體內查詢變數時，先看with體內是否存在所查詢變數，若不存在，再查詢with括起來的變數是否有要查詢的屬性。
如下例子更好地體現這一原則：
1function GetUserInfo() {
2var person = new Object();
3person.name = "Alan_beijing";
4person.address = "China-shanghai";
5person.age = 35;
6with (person) {
7var sex = "男";
8var age = 40;
9return name + "," + sex + "," + age +","+ address;
10}
11}
12
13alert(GetUserInfo());//Alan_beijing,男,40,China-shanghai
（六） switch
1.定義
switch語句就是我們平時所說的開關語句，它非常適用於多條件情況。
1switch (expression) {
2case value: statement
3break;
4case value: statement
5break;
6default:statement
7}
例子：
如下程式碼，根據城市名稱，查詢城市類別
1 //根據不同城市，判斷其屬於幾線城市
2function CityType(address) {
3switch (address) {
4case "Shanghai": alert("中國一線城市");
5break;
6case "Shenzhen": alert("中國一線城市");
7break;
8case "Beijing": alert("中國一線城市");
9break;
10default: alert("中國非一線城市");
11}
12}
13
14CityType("Shenzhen");//中國一線城市
2 注意點
(1)switch本質與if是一樣的，都是解決多條件多分支問題；
(2)使用switch語句的真正目的是避免使用過多的if..else if ...else....語句；
三 總結
本篇文章主要結合程式碼介紹了JavaScript的流程語句及其使用，重點結束了with,switch，for...in..,label,break和continue等語句， 需要注意的是，在JavaScript中，流程語句都沒有塊級作用域，至於什麼是塊級作用域，將在接下來的文章中與大家分享。
四 已釋出文章
【01】JavaScript之流程語句
【02】JavaScript之函式(一)