javascript的編寫風格規範

1、命名

（1）命名應遵循簡潔、語義化的原則,定義的時候賦值能更好的瞭解變量語義。

//bad
let id,inp,obj,shifou;

//good
let userId = 0,
    input = '',
    userInfo = null,
    isAdult = false;

 （2）變量名含多個單詞或者太長，可使用小駝峯式命名法並縮寫

//bad
let maximumNumber;

//good
let maxNum = 0;

 （3）全局常量使用大寫字母和下劃線來組合命名，下劃線用以分割單詞。

const MAX_COUNT = 10;
const URL = 'https://blog.csdn.net/m0_37820751';

2、縮進

行首的空格和 Tab 鍵，都可以產生代碼縮進效果，無論選擇哪一種方法都可以，只需統一使用一種。每次寫完一段代碼，養成格式化代碼的習慣。

3、行尾的分號

分號表示一條語句的結束。雖然JavaScript 允許省略行尾的分號。由於解釋引擎自動添加分號的行爲難以預測，因此編寫代碼的時候不應該省略行尾的分號。

可以不使用分號的情況
（1）for 和 while 循環

for ( ; ; ) {
} // 沒有分號

while (true) {
} // 沒有分號

（2）分支語句：if，switch，try

if (true) {
} // 沒有分號

switch () {
} // 沒有分號

try {
} catch {
} // 沒有分號

（3）函數的聲明語句

function f() {
} // 沒有分號

除了上面的三種情況，所有語句都應該使用分號，如果使用了分號，也不會出錯，因爲，解釋引擎會把這個分號解釋爲空語句

雖然不使用分號，大多數情況下，JavaScript 會自動添加。

var a = 1
// 等同於
var a = 1;

但如果下一行的開始可以與本行的結尾連在一起解釋，JavaScript 就不會自動添加分號。

// 等同於 var a = 3
var
a
=
3

// 等同於 'abc'.length
'abc'
.length

如果習慣了省略分號，可能會出現不容易看出來的BUG，所以建議不要省略這個分號。

// 引擎解釋爲 c(d+e)
var a = b + c
(d+e).toString();

// 解釋爲'b'['red', 'green']，
// 即把字符串當作一個數組，按索引取值
var a = 'b'
['red', 'green'].forEach(function (c) {
  console.log(c);
})

其他原因：有些 JavaScript 代碼壓縮器（uglifier）不會自動添加分號，因此遇到沒有分號的結尾，就會讓代碼保持原狀，而不是壓縮成一行，使得壓縮無法得到最優的結果。

另外，不寫結尾的分號，可能會導致腳本合併出錯。所以，有的代碼庫在第一行語句開始前，會加上一個分號。

;var a = 1;
// 避免與其他腳本合併時，排在前面的腳本最後一行語句沒有分號，導致運行出錯的問題。

4、嚴格相等運算符取代相等運算符

相等運算符會自動轉換變量類型，造成很多意想不到的情況。

0 == ''// true
1 == true // true
2 == true // false
0 == '0' // true
false == 'false' // false
false == '0' // true
' \t\r\n ' == 0 // true

如果需要判斷某值爲null，就不能使用===，那我們也可以使用邏輯運算符來取代==。

if(!judge){
    console.log('null');
}
//等同於
if(judge == null){
    console.log('null');
}

5、簡短的if語句可以改用三元運算符，減少代碼行數

if(a === b){
    console.log(1);
} else {
    console.log(2);
}
//等同於
a === b ?  console.log(1) : console.log(2);

6、let/const 取代 var

var 會重複聲明變量；let有塊級作用域，且沒有任何副作用；

var x = 'hello'
if (true) {
  var x = 'world';
}
console.log(x);   // world

var i = 100;
for (var i = 0; i < 10; i++) {
  console.log(i);
}
console.log(i);  // 10

var x = 'hello';
if (true) {
  let x = 'world';
}
console.log(x)  // hello

let i = 100;
for (let i = 0; i < 10; i++) {
  console.log(i);
}
console.log(i)  // 100

7、字符串使用單引號或反引號

靜態字符串一律使用單引號或反引號，不使用雙引號。動態字符串(字符串模板)使用反引號。用單引號的好處：

1.輸入單引號不需要按住shitf，方便輸入

2.在實際使用中，字符串很多時候會用來拼接html，html內有雙引號，字符串用單引號的話就可以省去了轉義html的雙引號。也可以統一自己的格式。

// good
const a = 'foobar';
const b = `foo${a}bar`;
const html = '<div class="red"></div>'

8、聲明定義較多時，使用結構賦值

let a = 1, b = 2, c = 3, d = 4;
//等同於
let [a, b, c, d] = [1, 2, 3, 4];

9、拷貝數組

使用擴展運算符（...）拷貝數組。

let listCopy = [];
// bad
for (let i = 0; i < list.length; i++) {
  listCopy[i] = list[i];
}

// good
let listCopy = [...list];

10、箭頭函數的使用。

那些使用匿名函數當作參數的場合，儘量用箭頭函數代替。因爲這樣更簡潔，而且綁定了 this。

let dataList = {
    value: 2,
}
let that = this;
$.ajax({
	type:'GET',
	url:'http://www.young1024.com:666/lyric?id=33894312',
	success: function (data) {
    console.log(data);
	console.log(this);   //ajax對象
	console.log(this.dataList); 
	}
})
			
//ajax --箭頭函數
$.ajax({
	type:'GET',
	url:'http://www.young1024.com:666/lyric?id=33894312',
	success: (data)=>{
	console.log(data);
	console.log(this);    //window對象
	console.log(this.dataList);
	}
})