javascript代碼規范小結

2020-10-23 18:29:22

字體：大中小

來源：轉載

供稿：網友

1. Javascript代碼應符合Douban-JSLint檢驗標準

1-1. 語句必須都有分號結尾，除了for, function, if, switch, try, while

1-2. 只有長語句可以考慮斷行，如：

TEMPL_SONGLIST.replace('{TABLE}', da['results'])
.replace('{PREV_NUM}', prev)
.replace('{NEXT_NUM}', next)
.replace('{CURRENT_NUM}', current)
.replace('{TOTAL_NUM}', da.page_total);

為了避免和JSLint的檢驗機制沖突，“.”或“＋”這類操作符放在行尾，上面代碼應改為：

TEMPL_SONGLIST.replace('{TABLE}', da['results']).
replace('{PREV_NUM}', prev).
replace('{NEXT_NUM}', next).
replace('{CURRENT_NUM}', current).
replace('{TOTAL_NUM}', da.page_total);

1-3. 避免額外的逗號。如：var arr = [1,2,3,];

1-4. 所有的循環體和判斷體都需要用"{}"括起來。如：

錯：

if (condition)
statement;
或
if (condition) statement;

對:

if (condition) {
statement; 或
if (condition) { statement; }

1-5. for-in循環體中必須用hasOwnProperty方法檢查成員是否為自身成員。避免來自原型鏈上的污染。

1-6. 變量聲明。變量聲明應放在function的最上面。避免使用未聲明的變量。

錯：

if (n > 0) {
var isvalid = true;

對：

var isvalid;
if (n > 0) {
isvalid = true;
}

1-7. 不要使用with, void, evil。

1-8. 使用嚴格的條件判斷符。用===代替==，用!==代替!=。

1-9. 下面類型的對象不建議用new構造：new Number, new String, new Boolean, new Object(用{}代替), new Array(用[]代替)。

1-10. 引用對象成員用obj.prop1代替obj[“prop1”]，除非屬性名是變量。

注：Douban-JSLint是定制過的JSLint

注：如果模塊代碼中，使用其它全局變量想跳過JSLint的檢查，可以在該文件中加入聲明，如：

2. Javascript命名規則

2-1. 構造器的首字母大寫。如：

function Dialog (config) {
statement;
} var dlg = new Dialog({...});

2-2. 對象的屬性或方法名采用小駝峰式(lower camel-case)，如"init", "bindEvent", "updatePosition"：

Dialog.prototype = {
init: function () {},
bindEvent: function () {},
updatePosition: function () {} };

2-3. 私有變量名用下劃線開頭。如："_current", "_defaultConfig"

2-4. 常量名全部大寫，單詞間用下劃線分隔。如：“CSS_BTN_CLOSE”, "TXT_LOADING"

2-5. 變量名的前綴：

Prefix

Element

Example

integer

nVariableName

i,j,k,m,n, etc. *

integer as counter/iterator

(for i=0; i<=oArray.length; i++)

string

sVariableName

object

oObjectName

is, can, has

boolean

[Boolean name]ConditionName

event method

event attachment

[event type]_MethodName

accessor method

getMethodName

accessor method

setMethodName

Note: Only a counter/iterator should use a single-letter designation.

3. 代碼格式化要求

3-1. 語句中的必要空格和縮進

3-1-1. 用來包含語句的"()"前后需要跟空格，諸如： if / for / while / switch ( statements ) { … } 等

3-1-2. "="前后需要跟空格

3-1-3. 數組成員間的","后面需要跟空格

不好：

for (t in selected) { if (!hash[t]) deselect(t) }

好：

for ( t in selected ) {
if ( !hash[t] ) {
deselect(t); }

3-2. 長語句采用斷行:

不好：

TEMPL_SONGLIST.replace('{TABLE}', da['results']).replace('{PREV_NUM}', prev).replace('{NEXT_NUM}', next).replace('{CURRENT_NUM}', current).replace('{TOTAL_NUM}', da.page_total);

好：

TEMPL_SONGLIST.replace('{TABLE}', da['results']).
replace('{PREV_NUM}', prev).
replace('{NEXT_NUM}', next).
replace('{CURRENT_NUM}', current).
replace('{TOTAL_NUM}', da.page_total);

3-3. 格式化對象參數：

不好：

embedSWF(id, { url: '/swf/player30792.swf?url=' + el.href, width: 261, height: 30, params: { wmode:'transparent' }, attributes: { id: "player-sample" + i, name: "player-sample" + i }});

好：

復制代碼代碼如下:

 
embedSWF(id, { 
url: '/swf/player30792.swf?url=' + el.href, 
width: 261, 
height: 30, 
params: { wmode:'transparent' }, 
attributes: { 
id: "player-sample" + i, 
name: "player-sample" + i 
}); 