摘要：本文總結了則的最佳實踐，希望對各位爪哇國編劇有用。使用有兩種等值運算符，分別是和，以及和。比較兩個值的時候，請使用前者，避免討厭的強制類型轉換帶來預料之外的結果。下只提供無強制類型轉換的別名和別名，不用頭疼選哪種。

本文總結了20則JavaScript的最佳實踐，希望對各位爪哇國編劇有用。（順帶推銷下CoffeeScript）

。

JavaScript有兩種等值運算符，分別是===和==，以及！==和！=。比較兩個值的時候，請使用前者，避免JavaScript討厭的強制類型轉換帶來預料之外的結果。

CoffeeScript下只提供無強制類型轉換的==（別名is）和!=（別名isnt），不用頭疼選哪種。

eval讓我們將字符串作為參數執行，這是非常強大的特性。然而，eval會大幅降低腳本的性能，也會引起安全問題。除非你打算用JavaScript寫一個編譯器，還是對eval敬而遠之的好。

省掉一些花括號，大多數瀏覽器仍然能理解，例如：

if(someVariableExists)  
   x = false

然而，復雜一點的代碼就可能帶來問題：

if(someVariableExists)  
   x = false  
   anotherFunctionCall();

你想表達的也許是：

if(someVariableExists) {  
   x = false;  
   anotherFunctionCall();  
}

然而實際上等價于：

if(someVariableExists) {  
   x = false;  
}  
anotherFunctionCall();

所以，還是乖乖地寫花括號吧，這能為你省去無數麻煩。

如果你真那么討厭花括號，還是投入CoffeeScript的懷抱吧：

if someVariable?
  x = false

if someVariable?
  x = false
  anotherFunctionCall()

同理，大多數瀏覽器允許你省略分號：

var someItem = "some string"  
function doSomething() {  
  return "something"  
}

這和省略花括號一樣糟糕，還是老實一點好：

var someItem = "some string";  
function doSomething() {  
  return "something";  
}

或者，投奔CoffeeScript吧，不用分號了：

someItem = "some string"
doSomething = -> "something"

函數的寫法是不是也很帥？直接定義一個匿名函數，然后把它賦給一個變量即可。

JSLint是一款非常棒的調試器，它會迅速找出代碼中的問題，包括語法錯誤、編碼風格和程序結構問題。

腳本加載是阻塞的，腳本加載并執行完之后，瀏覽器不能繼續渲染下面的內容。因此，用戶被迫等待更長時間。如果你的JavaScript腳本只是用來增強效果，那么請將它放在頁面的最后：

And now you know my favorite kinds of corn. 
  
  
  
  

糟糕的例子：

for(var i = 0; i < someArray.length; i++) {  
   var container = document.getElementById("container");  
   container.innerHtml += "my number: " + i;  
   console.log(i);  
}

每次循環都要計算數組的長度，每次都要遍歷DOM查詢“container”元素，效率低下！

改成這樣就好一些：

var container = document.getElementById("container");  
for(var i = 0, len = someArray.length; i < len;  i++) {  
   container.innerHtml += "my number: " + i;  
   console.log(i);  
}

遍歷數組或對象的時候不一定要用for，使用原生函數往往是更好的選擇：

var arr = ["item 1", "item 2", "item 3", ...];  
var list = "
" + arr.join("
") + "
";

避免模塊和類庫互相干擾。

var name = "Jeffrey";  
var lastName = "Way";  

function doSomething() {...}  

console.log(name);

更好：

var DudeNameSpace = {  
   name : "Jeffrey",  
   lastName : "Way",  
   doSomething : function() {...}  
}  
console.log(DudeNameSpace.name)

CoffeeScipt下變量默認非全局，不需要加var，而且編譯的時候，整個.coffee文件處于一個函數之中，也就是說，一個獨立的命名空間。使用CoffeeScript，不用再操心全局變量問題。

良好的注釋，幫助別人或者幾個月之后的你理解你的代碼。

“大多數訪問者啟用了JavaScript，不必擔心”這是很大的誤區。

花費一點時間查看下你漂亮的頁面在javascript被關閉時是什么樣的吧。設計網站時，首先假定 JavaScript 是被禁用的，在此基礎上，漸進增強網站。

setInterval(  
"document.getElementById("container").innerHTML += "My new number: " + i", 3000  
);

上面的代碼和eval如出一轍，效率低下。我們應該傳遞函數：

setInterval(someFunction, 3000);

看起來，使用with語句的代碼很清晰，例如：

with (being.person.man.bodyparts) {  
   arms = true;  
   legs = true;  
}

這比下面的要清爽得多：

being.person.man.bodyparts.arms = true;  
being.person.man.bodyparts.legs= true;

很不幸，使用with語句導致添加新成員時性能低下，我們還是用變量吧：

var o = being.person.man.bodyparts;  
o.arms = true;  
o.legs = true;

new加構造函數可以創建對象：

var o = new Object();  
o.name = "Jeffrey";  
o.lastName = "Way";  
o.someFunction = function() {  
   console.log(this.name);  
}

這種方法多受詬病，更好的做法是：

var o = {  
   name: "Jeffrey",  
   lastName = "Way",  
   someFunction : function() {  
      console.log(this.name);  
   }  
};

這樣我們就不需要直接調用構造函數，也不需要為傳遞給函數的參數的正確順序而提心吊膽。

創建數組也是一樣的道理。

var a = new Array();  
a[0] = "Joe";  
a[1] = "Plumber";

不如

var a = ["Joe","Plumber"];

var someItem = "some string";  
var anotherItem = "another string";  
var oneMoreItem = "one more string";

不如這樣：

var someItem = "some string",  
    anotherItem = "another string",  
    oneMoreItem = "one more string";

這樣代碼更清晰。

CoffeeScript？正如我們前面提到的，變量默認非全局，所以我們根本不需要var。

遍歷對象的屬性的時候，還會遍歷方法函數，真浪費。加上一個if語句過濾下：

for(key in object) {  
   if(object.hasOwnProperty(key) {  
      ...then do something...  
   }  
}

Firebug timer 可以簡單地確定操作消耗的時間：

function TimeTracker(){  
 console.time("MyTimer");  
 for(x=5000; x > 0; x--){}  
 console.timeEnd("MyTimer");  
}

午餐之余或上床睡覺之前，讀點書吧。床頭常發一本web開發方面的書。我喜歡讀的一些書包括：

Object-Oriented JavaScript

JavaScript: The Good Parts

Learning jQuery 1.3

Learning JavaScript

讀下吧。多讀幾遍。我常讀。

用括號包裹函數定義，然后應用函數：

(function doSomething() {  
   return {  
      name: "jeff",  
      lastName: "way"  
   };  
})();

CoffeeScript版本更簡潔：

(-> { name: "jeff", lastName: "way" })()

用do的話更清楚：

do -> { name: "jeff", lastName: "way" }

jQuery和Mootools可以節約你大量的開發時間——特別是處理AJAX。但是別忘了，使用庫永遠不會比原生代碼快（假定你編碼正確）。

本文為24 JavaScript Best Practices for Beginners的衍生作品，在其基礎上進行了歸并調整，并加入了 CoffeeScript 的內容。