代碼規範(RL-TOC)用更合理的方式寫 JavaScript

---

• 代碼能夠改變世界
• 不規範代碼能夠毀掉世界
• 只有先學會寫規範的代碼，才能夠走的更遠

編程語言之間有不少編程規範都是通用:

命名

• 不要用語言不明的縮寫，不用擔憂名字過長，名字必定要讓別人知道確切的意思;
• 類、類型、變量用名詞或組合名詞。如Member, ProductInfo;
• 函數名用動詞或者動賓組合詞來表示，如get/set，RenderPage();
• 布爾變量須要用is作前綴;
• 儘可能寫絕對路徑;

註釋

• 註釋是爲了解釋程序作了什麼(What)或者爲何這麼作(Why)，以及要特別注意的地方；
• 註釋不是爲了解釋程序如何工做的(How)；
• 最高境界：程序自己就應該能說明，若是程序須要額外的註釋，那說明這段代碼寫的很爛；

//通常註釋
------------------------------------------------
/*
 *
方法註釋
*/

Pascal - 全部單詞的首字母都大寫;
Camel - 第一個單詞首字母小寫，其餘單詞首字母大寫;

HTML

• HTML 問件的命名用Pascal【全部單詞的首字母都大寫 】的命名方式;
• Class命名用小寫字母連字符(-)來鏈接命名的不一樣單詞;
• ID命名用小寫字母連字符(-)來鏈接命名的不一樣單詞;

CSS

.ui-list{}

#btn-open-main-page{}

• css/less文件名用連字符(-)來鏈接不一樣單詞。
• 樣式用連字符(-)來鏈接命名的不一樣單詞。
• 從外部文件加載css，儘量減小文件數。加載標籤放在文件的head部分;
• 頁面中少許的樣式放在head的style標籤內，大量的樣式能夠提取到外部的css文件中,不要使用內聯式樣式;
• 編寫性能優化的選擇器。避免使用開銷大的CSS選擇器，好比*;

JavaScript

• js文件的命名，用連字符(-)來鏈接文件名中的不一樣單詞。如user-handler.js；
• 將99%的代碼放在外部js文件中，放在</body>的前邊，讓頁面的性能最大化；
• 屬性，方法均採用Camel【全部單詞的首字母都大寫】形式；
• 對象的構造函數(var變量)採用Pascal【第一個單詞首字母小寫，其餘單詞首字母大寫】形式；

var globalVariable = 'I am Global Variable';
function Person(name,age) {
  this.name = name;
  this.age = age;
  this.sayHi = function() {
    console.log('Hi, I am ' + this.name + ' ' + this.age + ' years old.');
  }
}

images命名：

• 用小寫字母和連字符(-)來鏈接命名的不一樣單詞。

【參考】

• 用更合理的方式寫 JavaScript；

• DIV+CSS規範命名大全集合；

• 前端代碼規範 及 最佳實踐；

• Airbnb JavaScript Style Guide；

---

純屬我的觀點,僅供參考