Javascript 編碼約定(編碼規(guī)范)

更新時(shí)間：2018年03月11日 00:49:53 投稿：mdxy-dxy

這篇文章主要介紹了Javascript 編碼約定(編碼規(guī)范),需要的朋友可以參考下

1、使用 strict 模式

在一個(gè)作用域(包括函數(shù)作用域、全局作用域)中，可以使用

"use strict";

來開啟 strict 模式。

2、縮進(jìn)

用 Tab 鍵進(jìn)行代碼縮進(jìn)，以節(jié)約代碼大小，使用4個(gè)空格的寬度來進(jìn)行縮進(jìn)(JSLint 建議)。

3、符號(hào)

1) 大括號(hào)

與語句放同一行，放于最后面；僅有一行語句，也使用大括號(hào)：

if (true) {
  //true
} else {
  //false
}

while (true) {
  //alert(1);
}

2) 空格

在逗號(hào)、分號(hào)、冒號(hào)后加空格
在操作符前后加空格
在大括號(hào)開始符之前
在大括號(hào)結(jié)束符和 else、while 或 catch 之間
在 for 的各個(gè)部分
如：

var a = [1, 2, 3];
var obj = {
  name: 'name',
  value: 'value'
};
for (var i = 0; i < 10; i++) {}
function func(a, b, c) {}

c = a + b;
if (a && b || c) {
  //if
} else {
  //else
}

try {
  //try
} catch(err) {
  //catch
}

3) 所有語句結(jié)束后，使用 ; 號(hào)結(jié)束

4、命名

對(duì)象：使用駝峰式，如：MyClass
方法、變量：使用混合式，如：getName(), myName
常量：大寫加下劃線，如：MY_NAME

5、單一 var 模式

只使用一個(gè) var 在函數(shù)頂部進(jìn)行變量聲明，作用如下：

1) 提供一個(gè)單一的地址已查找到函數(shù)需要的所有局部變量
2) 防止出現(xiàn)變量在定義前就被使用的邏輯錯(cuò)誤
3) 幫助牢記要聲明變量，盡可能少地使用全局變量
4) 更少的編碼

function func() {
  var a = 1,
    b = 2, 
    sum = a + b,
    obj = {
      name: 'name',
      value: 'value'
    },
  $btn = $('#btn');
  //函數(shù)體
}

6、循環(huán)

1) for 循環(huán)

var i, arr = [];
for (i = arr.length; i--;) {
  //arr[i];
}

注:

for (var i = 0; i < document.getElementsByName().length; i++) {
  //document.getElementsByName()[0];
}

這種方式每次對(duì) i 進(jìn)行長度比較的使用對(duì)會(huì)進(jìn)行 document 的查詢，而通常 DOM 操作是非常耗時(shí)的。

2) while 循環(huán)

var arr = [], 
  i = arr.length;
while (i--) {
  //處理
}

3) for-in 循環(huán)

var i,
  hasOwn = Object.prototype.hasOwnProperty;
for (i in man) {
  if (hasOwn.call(man, i)) { //過濾
    console.log(i, ':', man[i]);
  }
}

7、switch 選擇

switch (num) {
case 0:
  //do something
  break;
case 1:
  //do something
  break;
...
default:
  //do default
}

建議使用：

var obj = {
  '0': function() {
    //do somethins
  },
  '1': function() {
    // do somethis
  }, ...
}
if (obj.hasOwnProperty(num)) {
  obj[num]();
} else {
  //do default
}

8、使用 parseInt() 的數(shù)值約定

1) 每次都具體指定進(jìn)制參數(shù)：

var month = '09', day = '08';
month = parseInt(month, 10); //不加進(jìn)制參數(shù)便會(huì)轉(zhuǎn)換為八進(jìn)制
day = parseInt(day, 10);

2) 其他常用的將字符串轉(zhuǎn)換為數(shù)值的方法：

+'08';
Number('08');

9、字面量模式

不建議使用構(gòu)造函數(shù)來定義：

// built in constructors (avoid)
var o = new Object();
var a = new Array();
var re = new RegExp('[a-z]', 'g');
var s = new String();
var n = new Number();
var b = new Boolean();
throw new Error('message');

建議使用更優(yōu)的字面量模式：

// literals and primitives (prefer)
var o = {};
var a = [];
var re = /[a-z]/g;
var s = '';
var n = 0;
var b = false;
throw {
  name: 'Error',
  message: 'message'
}

10、其他

1) 變量內(nèi)的簡寫單詞如果在開頭則全小寫：xmlDocument，如果不在開頭則全大寫：loadXML
2) 變量必須是有意義的英文，禁止拼音

您可能感興趣的文章: