javascript的基本規范

時(shí)間:2022-06-26 02:16:39 網(wǎng)頁(yè)制作 我要投稿
  • 相關(guān)推薦

javascript的基本規范

對于很多剛到公司做前端的人來(lái)說(shuō),很多基本的規范可能都不知道。在項目開(kāi)發(fā)維護等工作中,我們不只要做得自己看得懂,還要別人也看得懂。而在js里也是如此。下面就由小編給大家分享下,js的一些基本規范吧。

本篇主要介紹JS的命名規范、注釋規范以及框架開(kāi)發(fā)的一些問(wèn)題。

目錄

1. 命名規范:介紹變量、函數、常量、構造函數、類(lèi)的成員等等的命名規范

2. 注釋規范:介紹單行注釋、多行注釋以及函數注釋

3. 框架開(kāi)發(fā):介紹全局變量沖突、單全局變量以及命名空間

1. 命名規范

駝峰式命名法介紹:

駝峰式命名法由小(大)寫(xiě)字母開(kāi)始,后續每個(gè)單詞首字母都大寫(xiě)。

按照第一個(gè)字母是否大寫(xiě),分為:

① Pascal Case 大駝峰式命名法:首字母大寫(xiě)。eg:StudentInfo、UserInfo、ProductInfo

② Camel Case 小駝峰式命名法:首字母小寫(xiě)。eg:studentInfo、userInfo、productInfo

1.1 變量

命名方法:小駝峰式命名法。

命名規范:前綴應當是名詞。(函數的名字前綴為動(dòng)詞,以此區分變量和函數)

命名建議:盡量在變量名字中體現所屬類(lèi)型,如:length、count等表示數字類(lèi)型;而包含name、title表示為字符串類(lèi)型。

示例:

// 好的命名方式

var maxCount = 10;

var tableTitle = 'LoginTable';

// 不好的命名方式

var setCount = 10;

var getTitle = 'LoginTable';

1.2 函數

命名方法:小駝峰式命名法。

命名規范:前綴應當為動(dòng)詞。

命名建議:可使用常見(jiàn)動(dòng)詞約定

動(dòng)詞   含義 返回值

can 判斷是否可執行某個(gè)動(dòng)作(權限) 函數返回一個(gè)布爾值。true:可執行;false:不可執行

has 判斷是否含有某個(gè)值 函數返回一個(gè)布爾值。true:含有此值;false:不含有此值

is 判斷是否為某個(gè)值 函數返回一個(gè)布爾值。true:為某個(gè)值;false:不為某個(gè)值

get 獲取某個(gè)值 函數返回一個(gè)非布爾值

set 設置某個(gè)值 無(wú)返回值、返回是否設置成功或者返回鏈式對象

load 加載某些數據 無(wú)返回值或者返回是否加載完成的結果

示例:

// 是否可閱讀

function canRead() {

return true;

}

// 獲取名稱(chēng)

function getName() {

return this.name;

}

1.3 常量

命名方法:名稱(chēng)全部大寫(xiě)。

命名規范:使用大寫(xiě)字母和下劃線(xiàn)來(lái)組合命名,下劃線(xiàn)用以分割單詞。

命名建議:無(wú)。

示例:

var MAX_COUNT = 10;

var URL = 'http://www.baidu.com';

1.4 構造函數

介紹:在JS中,構造函數也屬于函數的一種,只不過(guò)采用new 運算符創(chuàng )建對象。

命名方法:大駝峰式命名法,首字母大寫(xiě)。

命名規范:前綴為名稱(chēng)。

命名建議:無(wú)。

示例:

function Student(name) {

this.name = name;

}

var st = new Student('tom');

1.5 類(lèi)的成員

類(lèi)的成員包含:

① 公共屬性和方法:跟變量和函數的命名一樣。

② 私有屬性和方法:前綴為_(kāi)(下劃線(xiàn)),后面跟公共屬性和方法一樣的命名方式。

示例:

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支持兩種不同類(lèi)型的注釋?zhuān)簡(jiǎn)涡凶⑨尯投嘈凶⑨尅?/p>

2.1 單行注釋

說(shuō)明:?jiǎn)涡凶⑨屢詢(xún)蓚(gè)斜線(xiàn)開(kāi)始,以行尾結束。

語(yǔ)法:// 這是單行注釋

使用方式:

① 單獨一行://(雙斜線(xiàn))與注釋文字之間保留一個(gè)空格。

② 在代碼后面添加注釋?zhuān)?/(雙斜線(xiàn))與代碼之間保留一個(gè)空格,并且//(雙斜線(xiàn))與注釋文字之間保留一個(gè)空格。

③ 注釋代碼://(雙斜線(xiàn))與代碼之間保留一個(gè)空格。

示例:

// 調用了一個(gè)函數;1)單獨在一行

setTitle();

var maxCount = 10; // 設置最大量;2)在代碼后面注釋

// setName(); // 3)注釋代碼

2.2 多行注釋

說(shuō)明:以/*開(kāi)頭,*/結尾

語(yǔ)法:/* 注釋說(shuō)明 */

使用方法:

① 若開(kāi)始(/*)和結束(*/)都在一行,推薦采用單行注釋。

② 若至少三行注釋時(shí),第一行為/*,最后行為*/,其他行以*開(kāi)始,并且注釋文字與*保留一個(gè)空格。

示例:

/*

* 代碼執行到這里后會(huì )調用setTitle()函數

* setTitle():設置title的值

*/

setTitle();

2.3 函數(方法)注釋

說(shuō)明:函數(方法)注釋也是多行注釋的一種,但是包含了特殊的注釋要求,參照 javadoc(百度百科)。

語(yǔ)法:

/**

* 函數說(shuō)明

* @關(guān)鍵字

*/

常用注釋關(guān)鍵字:(只列出一部分,并不是全部)

注釋名 語(yǔ)法 含義 示例

@param @param 參數名 {參數類(lèi)型} 描述信息 描述參數的信息 @param name {String} 傳入名稱(chēng)

@return @return {返回類(lèi)型} 描述信息 描述返回值的信息 @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開(kāi)始計數,序號也包含。

* @param isAllSome {Boolean} :是否2個(gè)tr的cols必須完成一樣才能進(jìn)行合并。true:完成一樣;false(默認):不完全一樣

* @return void

* @author polk6 2015/07/21

* @example

* _________________ _________________

* | 年齡 | 姓名 | | 年齡 | 姓名 |

* ----------------- mergeCells(grid,[0]) -----------------

* | 18 | 張三 | => | | 張三 |

* ----------------- - 18 ---------

* | 18 | 王五 | | | 王五 |

* ----------------- -----------------

*/

function mergeCells(grid, cols, isAllSome) {

// Do Something

}

3. 框架開(kāi)發(fā)

3.1 全局變量沖突

在團隊開(kāi)發(fā)或者引入第三方JS文件時(shí),有時(shí)會(huì )造成全局對象的名稱(chēng)沖突,比如a.js有個(gè)全局函數sendMsg(),b.js也又有個(gè)全局函數sendMsg(),引入a.js和b.js文件時(shí),會(huì )造成sendMsg()函數沖突。

示例:

#FormatImgID_0#

3.2 單全局變量

所創(chuàng )建的全局對象名稱(chēng)是獨一無(wú)二的,并將所有的功能代碼添加到這個(gè)全局對象上。調用自己所寫(xiě)的代碼時(shí),以這個(gè)全局對象為入口點(diǎn)。

如:

* JQuery的全局對象:$和JQuery

* ExtJS的全局對象: Ext

示例:

#FormatImgID_1#

3.3 命名空間

在項目規模日益壯大時(shí),可采用命名空間方式對JS代碼進(jìn)行規范:即將代碼按照功能進(jìn)行分組,以組的形式附加到單全局對象上。

以Ext的chart模塊為例:

#FormatImgID_2# 


【javascript的基本規范】相關(guān)文章:

職場(chǎng)禮儀基本規范07-10

gmp規范的基本要求11-18

肯德基員工基本規范有哪些?07-12

2015職業(yè)道德基本規范06-27

護士職業(yè)道德基本規范06-29

企業(yè)內部控制基本規范07-05

幾種實(shí)用的JavaScript鼠標特效07-09

輕松學(xué)javascript學(xué)習教程(二)07-09

輕松學(xué)javascript學(xué)習教程(三)07-09

人人網(wǎng)javascript面試題07-12

99久久精品免费看国产一区二区三区|baoyu135国产精品t|40分钟97精品国产最大网站|久久综合丝袜日本网|欧美videosdesexo肥婆