JS語法系列(九)—— JS編程風格

所謂“編程風格”,指的是編寫代碼的樣式規則。

程序員固然可以自由選擇編程風格,但是好的編程風格有助于寫出質量更高、錯誤更少、更易于維護的程序。

所以,”編程風格”的選擇不應該基于個人愛好、熟悉程度、打字量等因素,而要考慮如何盡量使代碼清晰易讀、減少出錯。你選擇的,不是你喜歡的風格,而是一種能夠清晰表達你的意圖的風格。這一點,對于JS這種語法自由度很高的語言尤其重要。

一、縮進


空格和Tab鍵,都可以產生縮進效果(indent)。

Tab鍵可以節省擊鍵次數,但不同的文本編輯器對Tab的顯示不盡相同,有的顯示四個空格,有的顯示兩個空格,所以有人覺得,空格鍵可以使得顯示效果更統一。

無論你選擇哪一種方法,都是可以接受的,要做的就是始終堅持這一種選擇。不要一會使用Tab鍵,一會使用空格鍵。

二、區塊


如果循環和判斷的代碼體只有一行,JS允許該區塊省略大括號。
但是這樣容易造成錯誤,建議總是使用大括號表示區塊。

表示區塊起首的大括號,不要另起一行。因為JS會自動添加句末的分號,導致一些難以察覺的錯誤。

return
{ 
    key: value
};
// 相當于
return;
{ 
    key: value
};

三、圓括號


圓括號在JS中有兩種作用,一種表示函數的調用,一種表示表達式的組合。

// 圓括號表示函數的調用
console.log('abc');

// 圓括號表示表達式的組合
(1 + 2) * 3

我們可以用空格,區分這兩種不同的括號。

1、表示函數調用時,函數名名與左括號之間沒有空格。
2、表示函數定義時,函數名與左括號之間沒有空格。
3、其他情況時,前面位置的語法元素與左括號之間,都有一個空格。

四、行尾的分號


分號表示一條語句的結束。JS規定,行尾的分號可以省略。事實上,確實有一些開發者行尾從來不寫分號。但是,強烈建議還是不要省略這個分號。

4.1、不需要使用分號的情況

有一些語法結構不需要在語句的結尾添加分號,主要是以下三種情況。
(1)for和while循環

for ( ; ; ) {
} // 沒有分號

while (true) {
} // 沒有分號

需要注意的是do...while循環是有分號的。

do { 
    a--;
} while(a > 0); // 分號不能省略

(2)分支語句:if,switch,try

if (true) {
} // 沒有分號

switch () {
} // 沒有分號

try {
} catch {
} // 沒有分號

(3)函數的聲明語句

function f() {
} // 沒有分號

但是函數表達式仍然要使用分號。

var f = function f() {};

以上三種情況,如果使用了分號,并不會出錯。因為,解釋引擎會把這個分號解釋為空語句。

4.1、其它情況一律要寫上分號,不要讓JS引擎去猜測

五、全局變量


JS最大的語法缺點,可能就是全局變量對于任何一個代碼塊,都是可讀可寫。這對代碼的模塊化和重復使用,非常不利。

因此,盡量避免使用全局變量。

六、變量聲明


JS會自動將變量聲明”提升”到代碼塊的頭部。

為了避免可能出現的問題,最好把變量聲明都放在代碼塊的頭部。

所有函數都應該在使用之前定義,函數內部的變量聲明,都應該放在函數的頭部。

七、new命令


JS使用new命令,從構造函數生成一個新對象。

var o = new myObject();

上面這種做法的問題是,一旦你忘了加上newmyObject()內部的this關鍵字就會指向全局對象,導致所有綁定在this上面的變量,都變成全局變量。

因此,建議使用Object.create()命令,替代new命令。如果不得不使用new,為了防止出錯,最好在視覺上把構造函數與其他函數區分開來。比如,構造函數的函數名,采用首字母大寫,其他函數名一律首字母小寫。

八、with語句


不要使用with語句。

九、相等和嚴格相等


JS中有兩個表示“相等”的運算符:“相等”和“嚴格相等”。

因為“相等”運算符會自動轉換變量類型,造成很多意想不到的情況。因此,不要使用“相等”(==)運算符,只使用“嚴格相等”(===)運算符。

十、語句的合并


有些程序員追求簡潔,喜歡合并不同目的的語句。比如,原來的語句是

a = b;
if (a) { // ...}

他喜歡寫成下面這樣。

if (a = b) { // ...}  //賦值永遠都會成功

雖然語句少了一行,但是可讀性大打折扣,而且會造成誤讀,讓別人誤解這行代碼的意思是下面這樣。

if (a === b){ // ...}

建議不要將不同目的的語句,合并成一行。

十一、自增和自減運算符


自增(++)和自減(--)運算符,放在變量的前面或后面,返回的值不一樣,很容易發生錯誤。事實上,所有的++運算符都可以用+= 1代替。

十二、switch...case結構


switch...case結構要求,在每一個case的最后一行必須是break語句,否則會接著運行下一個case。這樣不僅容易忘記,還會造成代碼的冗長。

而且,switch...case不使用大括號,不利于代碼形式的統一。

建議避免使用switch...case結構,用對象結構代替。

(本系列完結)

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • FreeCodeCamp - Basic JavaScript 寫在前面: 我曾經在進谷前刷過這一套題,不過當時只...
    付林恒閱讀 16,493評論 5 28
  • 標簽: 我的筆記 ---學習資料:http://javascript.ruanyifeng.com/ 1. 導論 ...
    暗夜的怒吼閱讀 836評論 0 1
  • 1. Java基礎部分 基礎部分的順序:基本語法,類相關的語法,內部類的語法,繼承相關的語法,異常的語法,線程的語...
    子非魚_t_閱讀 31,740評論 18 399
  • 大選前后 開門見山。黃金是避險工具,所以往往這地球上發生重大的危機,經濟下滑,或者是極大的不確定性事件都會導致黃金...
    馬碩_磕基閱讀 322評論 0 3
  • 心目中的英雄,孤獨患者。有的人看起來孤獨,但也并非所以。孤獨的人之所以孤獨不是因為他將世界拒之不理,而是...
    顏兒志夏閱讀 170評論 0 2