js寫碼良好習慣

【JS方面】

1. 大多數語言縮進標準都默認遵照4空格，可是對於js來講，函數嵌套較多，因此爲了閱讀的方便，縮進可採用2空格。

2. 變量不要批量定義或賦值。如：

   var a,b,c = 10;    //不建議

3. 變量、函數名採用小駝峯命名，對象/類採用大駝峯命名。如：

   var youName = 「hehe」；

   var myFunction = function(){return "hehe";};

   function myFunction() {return "hehe";}

   function MyFunction(){this.name = "hehe";}

4. 建議普通地方的引號用單引號，由於json和XML等都規定用雙引號，這樣就能夠無需轉義。

5. 較爲嚴格的判斷使用===而不是==。

6. 對象的屬性千萬不要做爲原型定義，由於假如屬性是一個對象的話，不一樣實例中的屬性會指向同一個地址（那個對象定義時成員屬性所對應的地址），而且用原型定義的成員屬性是多個實例共享的（有點相似於static）。而成員函數避免定義在構造函數內，不然會有運行時的閉包開銷。如：

   function MyTest(name){    //這是正確的例子

       this.name = name;

       this.id = 1;

   }

   MyTest.prototype.getName() = function(){return this.name;};

7. 避免使用多重繼承、繼承樹以及其餘複雜的繼承，由於js畢竟只是基於對象而非面向對象的語言，複雜的繼承會讓程序的邏輯變得複雜，代碼可讀性下降。

8. 函數內的局部變量在函數開始時就聲明好，省得忘記或者形成其餘錯誤解析。如：

   var a = "hehe";

   function test(){

      console.log(a); 

       var a = "xixi";

   }

   test();     //輸出undefined

   function f1(){console.log(a);}

   f1();     //輸出hehe

   function f2(){

       var a = "yy";

       f1();

   }

   f2();     //輸出hehe

   要點一：之因此沒有輸出hehe或者xixi，是由於在須要訪問變量a時，js會首先在函數做用於內搜索是否有變量a（假如沒有，依次往上，直到全局），在函數做用域內找到了變量a，可是在執行到console.log(a);時，變量a尚未被聲明，因此結果會是undefined。

   要點二：爲何調用f2();也是輸出hehe呢？這是由於，js的做用域是靜態做用域，做用域的肯定是在定義時決定而不是在運行時，因此在定義時，在f2()執行到f1()時，跳到f1()，而f1()裏肯定了打印的是hehe，再返回f2()時繼續往下執行而不是去搜索變量a了。

9. 對象內的私有屬性命名已下劃線開頭（業內廣泛認可的寫法）。可是，這樣仍是不能避免對象的使用者非要修改這些屬性。。。。。。有兩種解決方案：一是使用閉包，二是使用類的封裝。如：

   //使用閉包的方式

   var test =function(){

       var count = 0;

       var get = function(){

           count++;

           return count;

      };

       return get;

   };

   var testDom = test();

   console.log(testDom());    //只能經過get訪問count，而不能直接訪問到count屬性了

   //使用類封裝的方式，請參照另外一篇博客：javascript模擬面向對象的類（http://my.oschina.net/u/1580821/blog/365342）

10. 慎用this，由於this是指向的是運行時的上下文對象（和上面第8點有點相反）。如：

    var test1 = {

       name:"name1",

        getName:function(){console.log(this.name);}

    };

    test1.getName();    //輸出name1

    var test2 = {

       hehe:test1.getName,

        name:"xixi"

    };

    test2.hehe();    //輸出xixi      this不屬於某個函數，而是函數調用時所屬的對象。

    固然，也能夠手動修改上下文範圍。。。

    var test3 = {name:"yy"};

    test2.hehe.call(test3);    //則輸出yy，此時傳入的test3改變this的上下文範圍。。。

    固然，也能夠綁定永久的上下文範圍，這樣不管被誰調用，不用傳上下文範圍都固定是綁定那個了。

    test2.hehe.bind(test3);   //綁定的上下文範圍是test3，之後調用就不用傳test3了，而且不管在哪調用上下文範圍都固定是test3。

    警告：儘可能避免二次bind綁定上下文範圍或參數表，二次綁定上下文範圍bind會失敗，由於其實現原來是調用call來實現，然而在其中間實現的時候沒有了this，因此二次綁定會失敗。