javascript的基本規範
對於很多剛到公司做前端的人來說，很多基本的規範可能都不知道。在專案開發維護等工作中，我們不只要做得自己看得懂，還要別人也看得懂。而在js裡也是如此。下面就由小編給大家分享下，js的一些基本規範吧。
本篇主要介紹JS的命名規範、註釋規範以及框架開發的一些問題。
目錄
1. 命名規範：介紹變數、函式、常量、建構函式、類的成員等等的命名規範
2. 註釋規範：介紹單行註釋、多行註釋以及函式註釋
3. 框架開發：介紹全域性變數衝突、單全域性變數以及名稱空間
1. 命名規範
駝峰式命名法介紹：
駝峰式命名法由小(大)寫字母開始，後續每個單詞首字母都大寫。
按照第一個字母是否大寫，分為：
① Pascal Case 大駝峰式命名法：首字母大寫。eg：StudentInfo、UserInfo、ProductInfo
② Camel Case 小駝峰式命名法：首字母小寫。eg：studentInfo、userInfo、productInfo
1.1 變數
命名方法：小駝峰式命名法。
命名規範：字首應當是名詞。(函式的名字字首為動詞，以此區分變數和函式)
命名建議：儘量在變數名字中體現所屬型別，如:length、count等表示數字型別;而包含name、title表示為字串型別。
示例：
// 好的命名方式
var maxCount = 10;
var tableTitle = 'LoginTable';
// 不好的命名方式
var setCount = 10;
var getTitle = 'LoginTable';
1.2 函式
命名方法：小駝峰式命名法。
命名規範：字首應當為動詞。
命名建議：可使用常見動詞約定
動詞 含義 返回值
can 判斷是否可執行某個動作(許可權) 函式返回一個布林值。true：可執行;false：不可執行
has 判斷是否含有某個值 函式返回一個布林值。true：含有此值;false：不含有此值
is 判斷是否為某個值 函式返回一個布林值。true：為某個值;false：不為某個值
get 獲取某個值 函式返回一個非布林值
set 設定某個值 無返回值、返回是否設定成功或者返回鏈式物件
load 載入某些資料 無返回值或者返回是否載入完成的結果
示例：
// 是否可閱讀
function canRead() {
return true;
}
// 獲取名稱
function getName() {
return this.name;
}
1.3 常量
命名方法：名稱全部大寫。
命名規範：使用大寫字母和下劃線來組合命名，下劃線用以分割單詞。
命名建議：無。
示例：
var MAX_COUNT = 10;
var URL = 'http://www.baidu.com';
1.4 建構函式
介紹：在JS中，建構函式也屬於函式的一種，只不過採用new 運算子建立物件。
命名方法：大駝峰式命名法，首字母大寫。
命名規範：字首為名稱。
命名建議：無。
示例：
function Student(name) {
this.name = name;
}
var st = new Student('tom');
1.5 類的成員
類的成員包含：
① 公共屬性和方法：跟變數和函式的命名一樣。
② 私有屬性和方法：字首為_(下劃線)，後面跟公共屬性和方法一樣的命名方式。
示例：
function Student(name) {
var _name = name; // 私有成員
// 公共方法
this.getName = function () {
return _name;
}
// 公共方式
this.setName = function (value) {
_name = value;
}
}
var st = new Student('tom');
st.setName('jerry');
console.log(st.getName()); // => jerry：輸出_name私有變數的值
2. 註釋規範
JS支援兩種不同型別的註釋：單行註釋和多行註釋。
2.1 單行註釋
說明：單行註釋以兩個斜線開始，以行尾結束。
語法：// 這是單行註釋
使用方式：
① 單獨一行：//(雙斜線)與註釋文字之間保留一個空格。
② 在程式碼後面添加註釋：//(雙斜線)與程式碼之間保留一個空格，並且//(雙斜線)與註釋文字之間保留一個空格。
③ 註釋程式碼：//(雙斜線)與程式碼之間保留一個空格。
示例：
// 呼叫了一個函式;1)單獨在一行
setTitle();
var maxCount = 10; // 設定最大量;2)在程式碼後面註釋
// setName(); // 3)註釋程式碼
2.2 多行註釋
說明：以/*開頭，*/結尾
語法：/* 註釋說明 */
使用方法：
① 若開始(/*)和結束(*/)都在一行，推薦採用單行註釋。
② 若至少三行註釋時，第一行為/*，最後行為*/，其他行以*開始，並且註釋文字與*保留一個空格。
示例：
/*
* 程式碼執行到這裡後會呼叫setTitle()函式
* setTitle()：設定title的值
*/
setTitle();
2.3 函式(方法)註釋
說明：函式(方法)註釋也是多行註釋的一種，但是包含了特殊的註釋要求，參照 javadoc(百度百科)。
語法：
/**
* 函式說明
* @關鍵字
*/
常用註釋關鍵字：(只列出一部分，並不是全部)
註釋名 語法 含義 示例
@param @param 引數名 {引數型別} 描述資訊 描述引數的資訊 @param name {String} 傳入名稱
@return @return {返回型別} 描述資訊 描述返回值的資訊 @return {Boolean} true:可執行;false:不可執行
@author @author 作者資訊 [附屬資訊：如郵箱、日期] 描述此函式作者的資訊 @author 張三 2015/07/21
@version @version XX.XX.XX 描述此函式的版本號 @version 1.0.3
@example @example 示例程式碼 演示函式的使用 @example setTitle('測試')
示例：
/**
* 合併Grid的行
* @param grid {Ext.Grid.Panel} 需要合併的Grid
* @param cols {Array} 需要合併列的Index(序號)陣列;從0開始計數，序號也包含。
* @param isAllSome {Boolean} ：是否2個tr的cols必須完成一樣才能進行合併。true：完成一樣;false(預設)：不完全一樣
* @return void
* @author polk6 2015/07/21
* @example
* _________________ _________________
* | 年齡 | 姓名 | | 年齡 | 姓名 |
* ----------------- mergeCells(grid,[0]) -----------------
* | 18 | 張三 | => | | 張三 |
* ----------------- - 18 ---------
* | 18 | 王五 | | | 王五 |
* ----------------- -----------------
*/
function mergeCells(grid, cols, isAllSome) {
// Do Something
}
3. 框架開發
3.1 全域性變數衝突
在團隊開發或者引入第三方JS檔案時，有時會造成全域性物件的'名稱衝突，比如a.js有個全域性函式sendMsg()，b.js也又有個全域性函式sendMsg()，引入a.js和b.js檔案時，會造成sendMsg()函式衝突。
示例：
#FormatImgID_0#
3.2 單全域性變數
所建立的全域性物件名稱是獨一無二的，並將所有的功能程式碼新增到這個全域性物件上。呼叫自己所寫的程式碼時，以這個全域性物件為入口點。
如：
* JQuery的全域性物件：$和JQuery
* ExtJS的全域性物件： Ext
示例：
#FormatImgID_1#
3.3 名稱空間
在專案規模日益壯大時，可採用名稱空間方式對JS程式碼進行規範：即將程式碼按照功能進行分組，以組的形式附加到單全域性物件上。
以Ext的chart模組為例：
#FormatImgID_2#