|
switch模式
按照下面的風(fēng)格寫(xiě)switch的話，可以提高你的代碼可讀性和健壯性：
var inspect_me = 0,
result = '';
switch (inspect_me) {
case 0:
result = "zero";
break;
case 1:
result = "one";
break;
default:
result = "unknown";
}
需要注意下面幾個(gè)方面：
- 將case和switch對(duì)齊。
- case的內(nèi)容縮進(jìn)
- 每一個(gè)case之后都有一個(gè)清晰的break
- 避免順序往下執(zhí)行case，非要如此的話，文檔一定要寫(xiě)清楚
- 最后使用default，保證在沒(méi)有命中case的情況下也有反饋
避免隱藏的類(lèi)型轉(zhuǎn)換
Javascript在你比較兩個(gè)變量的時(shí)候會(huì)進(jìn)行類(lèi)型的轉(zhuǎn)換，這就是為什么 false == 0或者”" == 0會(huì)返回true。
為了避免這種隱藏的類(lèi)型轉(zhuǎn)換帶來(lái)的迷惑，最好使用===或者!==操作符來(lái)比較：
var zero = 0;
if (zero === false) {
// not executing because zero is 0, not false
}
// antipattern
if (zero == false) {
// this block is executed...
}
還有另外一種流派持這樣的觀點(diǎn)：當(dāng)==夠用時(shí)使用===就是多余的。比如，當(dāng)你使用typeof的時(shí)候你知道會(huì)返回string，所以沒(méi)必要使用嚴(yán)格的檢驗(yàn)。然而，JSLint要求嚴(yán)格檢驗(yàn)；他最大程度使代碼在閱讀的時(shí)候減少歧義，(“這個(gè)==是故意呢還是疏漏？”)。
避免使用eval()
如果你在你的代碼中使用eval()，那么要記住”eval() is evil”。這個(gè)方法會(huì)將傳入的字符串當(dāng)做js代碼來(lái)執(zhí)行。如果代碼是在運(yùn)行前就確定的，那么沒(méi)有必要使用eval()。如果代碼是在運(yùn)行時(shí)動(dòng)態(tài)確定的，那么也有其他更安全的辦法。例如使用方括號(hào)形式訪問(wèn)元素的屬性：
// antipattern
var property = "name";
alert(eval("obj." + property));
// preferred
var property = "name";
alert(obj[property]);
使用eval()還有安全問(wèn)題，比如你運(yùn)行網(wǎng)絡(luò)上的一段代碼，而這段代碼又被別人篡改了。在處理Ajax請(qǐng)求返回的JSON數(shù)據(jù)的時(shí)候，最好還是使用瀏覽器內(nèi)建的處理方法，如果對(duì)于低端的瀏覽器不支持的，可以從JSON.org上下載對(duì)應(yīng)的處理庫(kù)。
另外還要記住使用setTimeout、setInterval以及Function的構(gòu)造函數(shù)的是，傳入的字符串的參數(shù)，js的處理方法跟eval()類(lèi)似，所以也要注意。因?yàn)�，js會(huì)把你傳入的字符串解析執(zhí)行：
// antipatterns
setTimeout("myFunc()", 1000);
setTimeout("myFunc(1, 2, 3)", 1000);
// preferred
setTimeout(myFunc, 1000);
setTimeout(function () {
myFunc(1, 2, 3);
}, 1000);
使用Function的構(gòu)造函數(shù)，跟eval()差不多，也要注意。這是個(gè)非常有用的功能，但是常常被錯(cuò)用。如果你必須使用eval()，那么可以考慮new一個(gè)Function來(lái)替代。另外的一個(gè)好處就是，使用Function的構(gòu)造函數(shù)，函數(shù)的作用域在本方法內(nèi)，這樣你使用var聲明的變量就不會(huì)變成全局的。另外一個(gè)防止eval()生成全局變量的辦法就是使用匿名函數(shù)。
看看下面這個(gè)例子，只有un變量最終是全局的：
console.log(typeof un); // "undefined"
console.log(typeof deux); // "undefined"
console.log(typeof trois); // "undefined"
var jsstring = "var un = 1; console.log(un);";
eval(jsstring); // logs "1"
jsstring = "var deux = 2; console.log(deux);";
new Function(jsstring)(); // logs "2"
jsstring = "var trois = 3; console.log(trois);";
(function () {
eval(jsstring);
}()); // logs "3"
console.log(typeof un); // number
console.log(typeof deux); // undefined
console.log(typeof trois); // undefined
eval()和Function構(gòu)造函數(shù)的另一個(gè)區(qū)別就是eval()會(huì)影響到作用域，而Function則相當(dāng)于一個(gè)沙盒。例如：
(function () {
var local = 1;
eval("local = 3; console.log(local)"); // logs 3
console.log(local); // logs 3
}());
(function () {
var local = 1;
Function("console.log(typeof local);")(); // logs undefined
}());
出處：rockux
責(zé)任編輯：bluehearts
上一頁(yè) 如何編寫(xiě)高質(zhì)量的Javascript代碼 [5] 下一頁(yè) 如何編寫(xiě)高質(zhì)量的Javascript代碼 [7]
◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。
|
第 1 頁(yè) 
第 6 頁(yè) 如何編寫(xiě)高質(zhì)量的Javascript代碼 [6]
