JavaScript編碼風(fēng)格指南:一、基本的格式化

1.1 使用4個空格作為一個縮進層級。

1.2 語句結(jié)尾寫分號。

1.3 代碼單行長度不超過80個字符。

1.4 換行:

當(dāng)一行長度達到了單行最大字符數(shù)限制時,就需要手動將一行拆成兩行。通常會在運算符后換行,下一行將會增加兩個層級的縮進。

//好的做法
if (isLeapYear && isFebruary && day == 29 && itsYourBirthday && 
        noPlans) {
    waitAnotherFourYears();
}

//不好的做法:第二行只有一個縮進
callAFunction(document, element, window, "some string value", true, 
    123, navigator);

//不好的做法:在運算符之前換行了
callAFunction(document, element, window, "some string value", true
    , 123,navigator);
    

這個規(guī)則有一個例外:當(dāng)給變量賦值時,第二行的位置應(yīng)當(dāng)與賦值運算符的位置保持對其。例如:

var result = something + anotherThing + yetAnotherThing + someThingElse + 
             anotherSomethingElse;

1.5 空行

空行是常常被忽略的一個方面,通常來講,代碼看起來應(yīng)當(dāng)像一系列可讀的段落,而不是一大段揉在一起。應(yīng)該在下面這些場景中添加空行:

  • 在方法之間
  • 在方法中的局部變量和第一條語句之間
  • 在多行或單行注釋之間
  • 在方法內(nèi)的邏輯片段之間
  • 其他...

1.6 命名

“計算機科學(xué)只存在兩個難題:緩存失敗和命名?!?————Phil Karlton。

使用駝峰命名方法給變量和函數(shù)命名。如:anotherThing、yetAnotherThing。
鏈接:常用命名

1.6.1 變量和函數(shù)
遵守駝峰大小寫命名法;
變量名:前綴應(yīng)該是名詞;
函數(shù)名:前綴應(yīng)該是動詞。如:

//好的寫法
var count =10;
var myName = "Jwk";
var found = true;

//不好的寫法:變量看起來像函數(shù)
var getCount = 10;
var isFound = true;

//好的寫法
function getName() {
    return myName;
}

//不好的寫法:函數(shù)看起來像變量
function theName() {
    return myName;
}

常用動詞:(鏈接:更多

| can | 函數(shù)返回一個布爾值 |
| has | 函數(shù)返回一個布爾值 |
| is | 函數(shù)返回一個布爾值 |
| get | 函數(shù)返回一個非布爾值 |
| set | 函數(shù)用來保存一個值 |

1.6.2 常量

雖然JavaScript中并沒有真正的常量的概念,但這并不能阻止開發(fā)者將變量作為常量。

約定使用大寫字母和下劃線來命名常量。例如:

if (count < MAX_COUNT) {
    doSomething();
}

1.6.3 構(gòu)造函數(shù)

在JavaScript中,構(gòu)造函數(shù)是前面冠以new運算符的函數(shù),用來創(chuàng)建對象。例如,Object和RegExp。所以開發(fā)者創(chuàng)建自己的構(gòu)造函數(shù)時,命名應(yīng)該與本地語言保持一致,采用駝峰命名法。

駝峰命名分為大寫和小寫兩種,例如anoherName和AnotherName,構(gòu)造函數(shù)采用后一種大寫模式,這樣可以將構(gòu)造函數(shù)從變量和普通函數(shù)中區(qū)分出來。

看下一段代碼:

var me = Person("Nicholas");
var you = getPerson("Michael");

根據(jù)上面的約定,我們一眼可以看出來第一行出了問題,缺少new運算符,第二行看起來還ok。

1.7直接量

1.7.1 字符串

約定使用雙引號包裹字符串。

約定不使用“\”來創(chuàng)建多行字符串,使用“+”代替。

1.7.2 數(shù)字

//整數(shù)
var count = 10;

//小數(shù)
var price = 10.0;
var price = 10.00;

//不推薦的小數(shù)寫法:沒有小數(shù)部分
var price = 10.;

//不推薦的小數(shù)寫法:沒有整數(shù)部分
var price = .1;

//不推薦的寫法:八進制寫法已經(jīng)被棄用了
var num = 010;

1.7.3 null 和 undefined

這兩個詞經(jīng)常會被搞混,邪門的是null === undefined 返回結(jié)果竟為true。

null :把他當(dāng)做對象的占位符
undefined :沒有被初始化的變量都有一個初始值,即undefined,表示這個變量等待被賦值。

1、如果你使用了一個可能賦值為一個對象的變量時,將其賦值為null。不要寫聲明了但未賦值的變量。

//好的做法
var person = null;
console.log(person === null);        //true
console.log(typeof person);          //"object"

//不好的做法,foo未被聲明
var person;
console.log(typeof person);          //"undefined"
console.log(typeof foo);             //"undefined"

這樣寫就可以保證只有在一種情況下typeof才會返回“undefined”:當(dāng)變量未聲明時。

2、比較的時候注意,因為 undefined === null ,返回true

//不好的寫法
var person;
if (person != null) {
    //...
}

1.7.4 對象直接量

最流行的做法是使用對象直接量方法替代傳統(tǒng)的創(chuàng)建object實例再添加屬性的做法。

//不好的寫法
var book = new Object();
book.title = "編寫可維護的 JavaScript";

//好的寫法
var book = {
    title : "編寫可維護的 JavaScript"
}

1.7.5 數(shù)組直接量

同對象直接量一樣。

//不好的寫法
var colors = new AArray("red", "green", "blue");

//好的寫法
var color = [ "red", "green", "blue"];
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 第1章 JavaScript 簡介 JavaScript 具備與瀏覽器窗口及其內(nèi)容等幾乎所有方面交互的能力。 歐洲...
    力氣強閱讀 1,172評論 0 0
  • 本章內(nèi)容 語法 數(shù)據(jù)類型 流控制語句 理解函數(shù) 3.1 語法 3.1.1 區(qū)分大小寫 區(qū)分大小寫 3.1.2 標(biāo)識...
    悶油瓶小張閱讀 735評論 0 0
  • FreeCodeCamp - Basic JavaScript 寫在前面: 我曾經(jīng)在進谷前刷過這一套題,不過當(dāng)時只...
    付林恒閱讀 16,493評論 5 28
  • 翻了翻手機相冊,驚奇的發(fā)現(xiàn),竟然沒有自拍照!??!作為一個女生,竟然沒有自拍,多么悲傷的消息。。。 接下來,事情變成...
    bobo屋閱讀 189評論 2 0
  • 。。這么多年了,看清一個人還是得靠錢啊。。
    我是瑪莎閱讀 148評論 0 0