今天來讓我們講講寫作風格吧，什麼叫做寫作風格呢？

指的是我們在撰寫程式時的樣式規則，也就是所謂的寫作習慣，每個人當然都會有自己的習慣，但當多人協作時，好的寫作習慣絕對是有益於團隊合作的，尤其對於 JavaScript 這樣自由度很高的程式語言，能使用程式清晰易讀、減少出錯、可以清楚表達你的意圖的風格，尤其重要。

今天會針對這幾點來做介紹

• 大括號排版
• 空格
• 分號
• 等號
• 變數宣吿
• 全域變數
• 命名方式
• 自增和自減

就讓我們開始吧！

大括號排版

大括號建議不要另起新的一行，因為 JavaScript 會在 return 後自動加上分號。

    // Good
    
    function run() {
        return {
            abc: 123
        }
    }
    console.log(run()); // {abc: 123}
    
    // Bad
    
    function run() {
        return 
        {
            abc: 123
        }
    }
    console.log(run()); // undefined

空格

對於空格並沒有特別的規範，所以依照各團隊習慣為主，在此建議函式與括號都不使用空格，其餘空一格，閱讀上會較為舒適。

    // Good
    
    var a = 0;
    if(a === 0) {}
    function foo(b) {
        return (a + b);
    }
    (function(x) {
        foo(x);
    })();
    
    // Bad 
    
    var a=0;
    if(a===0){}
    function foo(b){
        return (a+b);
    }
    (function (x) {
        foo (x);
    })();
    

分號

若下一行的第一個字元是 (、[、/、+、- ，則不會自動加上分號，所以請不要省略分號。

    // Good 
    
    var a = 1;
    (function() {
        return "xxx";
    })();
    
    // Bad ( 1 is not a function ) 
    
    var a = 1
    (function () {
        return "xxx"
    })()
    

等號

如果可以，盡量不要使用兩個等號的判斷 ==，因為在進行比較時會自動轉換型別，應該使用較為嚴謹的三等號 ===，避免因為自動轉型造成判斷上的不明確。

    // Good
    
    console.log(0 === ""); // false
    console.log(1 === true); // false
    console.log(2 === true); // false
    console.log(0 === "0"); // false
    console.log(false === "false"); // false
    console.log(false === "0"); // false
    
    // Bad
    
    console.log(0 == ""); // true
    console.log(1 == true); // true
    console.log(2 == true); // false
    console.log(0 == "0"); // true
    console.log(false == "false"); // false
    console.log(false == "0"); // true
    

使用 == 判斷時，等號兩邊的值會先自動轉型，再進行比較。

變數宣告

變數的宣告一律都放在函式的最前方，可以避免 Hoisting 問題。

    // Good 
    
    var o;
    if(!o) {
        o = {};
    }
    
    // Bad
    
    if (!o) {
        var o = {};
    }

全域變數

盡量變免全域變數的使用，改使用立即函式，若真的無法避免，在變數名稱前加上底線來作為區隔。

    // Good
    
    (function() {
        var _upperCase;
    })();
    

命名方式

避免忘記 new，建構函式的命名字首應該大寫。

    // Good
    
    function MyObject() {
        this.x = 100;
    }
    
    var q = new MyObject();
    
    // Bad 
    
    function myObject() {
        this.x = 100;
    }
    
    var q = myObject();
    

變數中唯二能使用的符號為底線 _ 和 錢字號 $，其餘都必須是字母或者數字，這邊要記得一點，無法使用數字作為開頭命名，保留字的部分也無法做使用。ex. switch、if、else 等等

以下提供命名的規則供大家參考

• 變數使用駝峰式命名 ( Camel Case )
  第一個單字字首小寫，第二個單字字首大寫，ex. object、myObject。
• 類別使用巴斯卡命名 ( Pascal Case )
  每個單字字首皆為大寫，ex. Server、MyObject。
• 常數使用全大寫
  每個單字使用底線作為連接， ex. PI = 3.14、MAX_WIDTH = 1024。
• 私有變數使用底線作為開頭
  不公開做使用的變數通常前方會加上 _， ex. _width、_user
• 系統內部使用前後雙底線
  ex: __ proto __

自增與自減

i++ 為先顯示變數再做累加， ++i 則為先進行累加再做顯示。

    var i = 0;
    console.log(i++); //0
    console.log(i); // 1
    
    var a = 0;
    console.log(++a); //1
    console.log(a); // 1
    

最近天氣變得好冷，好容易想睡覺啊 ...

參考資料：

Tommy - 深入 JavaScript 核心課程
阮一峰 - Javascript 編程風格
型別判斷結果