有時(shí)候一個代碼塊應(yīng)該只在一定條件下運(yùn)行。流程控制 - 通過?`if`?和?`else`?代碼塊,讓你的代碼只在滿足一定的條件下運(yùn)行。
~~~
// Flow control
var foo = true;
var bar = false;
if ( bar ) {
// This code will never run.
console.log( "hello!" );
}
if ( bar ) {
// This code won't run.
} else {
if ( foo ) {
// This code will run.
} else {
// This code would run if foo and bar were both false.
}
}
~~~
雖然在單行?`if`?語句里,大括號不是必須的,但應(yīng)該保持一致的使用它們,這樣使得代碼會更有可讀性。
注意不要在?`if`?或?`else`?代碼塊中,多次定義相同名稱的函數(shù)。因?yàn)檫@樣做可能會得不到預(yù)期的結(jié)果。
## Truthy 和 Falsy
為了成功的使用流程控制,重要的一點(diǎn)是需要理解哪些類型的值是“truthy”,哪些是“falsy”。有時(shí)候一個值實(shí)際計(jì)算的結(jié)果和看起來應(yīng)該會得到的結(jié)果不同。
~~~
// Values that evaluate to false:
false
"" // An empty string.
NaN // JavaScript's "not-a-number" variable.
null
undefined // Be careful -- undefined can be redefined!
0 // The number zero.
~~~
~~~
// Everything else evaluates to true, some examples:
"0"
"any string"
[] // An empty array.
{} // An empty object.
1 // Any non-zero number.
~~~
## 有條件的變量賦值與三元運(yùn)算符
有時(shí)一個變量要根據(jù)一些條件而設(shè)定。可以使用?`if`?或?`else`?語句,但在許多情況下,三元運(yùn)算符更加方便。三元運(yùn)算符測試一個條件,如果條件為真,則返回一個確定的值,否則返回一個不同的值。
三元運(yùn)算符:
~~~
// Set foo to 1 if bar is true; otherwise, set foo to 0:
var foo = bar ? 1 : 0;
~~~
雖然三元運(yùn)算符可以在不將返回值賦值給變量的情況下使用,但這是不推薦的。
## switch 語句
比起使用一系列的?`if`?或?`else`?代碼塊,有時(shí)使用一個?`switch`?語句替代會更有效。`switch`?語句查看一個變量或表達(dá)式的值,并根據(jù)不同的值執(zhí)行不同的代碼塊。
~~~
// A switch statement
switch ( foo ) {
case "bar":
alert( "the value was bar -- yay!" );
break;
case "baz":
alert( "boo baz :(" );
break;
default:
alert( "everything else is just ok" );
}
~~~
在 JavaScript 中 switch 語句有些不太流行,因?yàn)橥瑯拥男袨榭梢酝ㄟ^創(chuàng)建一個可重用和易測試的對象來完成。
~~~
var stuffToDo = {
"bar": function() {
alert( "the value was bar -- yay!" );
},
"baz": function() {
alert( "boo baz :(" );
},
"default": function() {
alert( "everything else is just ok" );
}
};
// Check if the property exists in the object.
if ( stuffToDo[ foo ] ) {
// This code won't run.
stuffToDo[ foo ]();
} else {
// This code will run.
stuffToDo[ "default" ]();
}
~~~
對象會在?[類型](http://js101.co/javascript-101/types.html)?和?[對象](http://js101.co/javascript-101/objects.html)?部分進(jìn)一步討論。
