代碼優(yōu)化的基本原則

1. 易讀性優(yōu)先
2. 如果不是性能瓶頸，就不要為了性能而改寫(xiě)代碼

let array = []
for(let i = 0 ; i< array.length; i++){}
每次進(jìn)入for循環(huán)，都要重新計(jì)算array.length;但是沒(méi)必要let l = array.lengrh; i < l;因?yàn)槊?次計(jì)算array.length不會(huì)造成性能瓶頸。

3. 復(fù)雜性守恒原則：無(wú)論怎么寫(xiě)代碼，復(fù)雜性都不會(huì)消失的。

命名規(guī)則：

1. 注意詞性：

• 普通變量/屬性用名詞

var person = {name: 'lili'}

• bool變量/屬性用形容詞或者be動(dòng)詞或者情態(tài)動(dòng)詞或者hasx

var person  = {
  dead: false; //如果是形容詞，前面就沒(méi)有必要加is。
  canSpeak: true;  //情態(tài)動(dòng)詞有can.should,will,need等，情態(tài)動(dòng)詞后接名詞。
  isVip:true;//be動(dòng)詞有is,was等，后一般接名詞
  hasChildren:true;//has加名詞
}

• 普通函數(shù)、方法用動(dòng)詞開(kāi)頭

var person = {
  run(){} //不及物動(dòng)詞，一般不需要參數(shù)
  drinkWater()//及物動(dòng)詞 一般需要參數(shù)
}

• 回調(diào)和鉤子函數(shù)使用介詞和動(dòng)詞的現(xiàn)在完成時(shí)

var person = {
  beforeDie(),
  afterDie()
  dead()
}

• 容易混淆的地方加前綴

domDiv1.addClass('active') //DOM對(duì)象
$div1.addClass('active') //jQuery對(duì)象

• 屬性訪問(wèn)器可以用名詞

$div.text() //等價(jià)于$div.getText()
$div.text('hi') //等價(jià)于$div.setTetx('hi')

2. 注意代碼的一致性

• 介詞一致性
  如果使用了before+after,那么就在代碼的所有地方都堅(jiān)持使用
  如果使用了before + 完成時(shí),就在其他地方也堅(jiān)持使用
  如果改來(lái)改去就不一定了，就會(huì)導(dǎo)致閱讀者的不可預(yù)測(cè)。
• 順序一致性
  比如uodateContainerWidth和 uodateHeightOfContainer的順序就很別扭，容易引發(fā)不可預(yù)測(cè)。
• 表里一致性
  函數(shù)名必須完美體現(xiàn)函數(shù)的功能，既不能多也不能少

function getSongs(){
  return $.get('/songs).then((response){
    div.innerText = response.songs
   })
}

以上代碼就違背了表里一致性的原則，函數(shù)名只表示獲取歌曲，但是函數(shù)具體的內(nèi)容還包括更新div，所以可以改成以下兩種寫(xiě)法：

//糾正函數(shù)名
function getSongAndUpadteDiv(){
  return $.get('/songs).then((response){
    div.innerText = response.songs
   })
}
//寫(xiě)成兩個(gè)函數(shù)
function getSongs(){
  return $.get('/songs)
}
funciton updateDiv(songs){
   div.innerText = response.songs
}
getSongs().then((response) => {
  updateDiv(response.songs)
 })

• 時(shí)間一致性
  有可能隨著代碼的變遷，一個(gè)變量的含義已經(jīng)不同于一開(kāi)始的含義了，這個(gè)時(shí)候就需要及時(shí)更改這個(gè)變量。

改代碼的思路及方法

如果你的代碼有單元測(cè)試，那么改起來(lái)就很放心，如果沒(méi)有單元測(cè)試，就需要用小步快跑的策略一點(diǎn)點(diǎn)進(jìn)行修改。
小步快跑的意思就是說(shuō)，每次只修改一點(diǎn)點(diǎn)，測(cè)試通過(guò)之后，在修改一點(diǎn)點(diǎn)。

• 使用函數(shù)來(lái)優(yōu)化代碼
  步驟：
  1. 將一坨代碼放到一個(gè)函數(shù)里
  2. 將代碼依賴(lài)的外部變量作為參數(shù)
  3. 將代碼的輸出作為函數(shù)的返回值
  4. 給函數(shù)取一個(gè)合適的名字
  5. 調(diào)用這個(gè)函數(shù)并傳入?yún)?shù)
  6. 這個(gè)函數(shù)里的代碼如果超過(guò)了5行，請(qǐng)重復(fù)1
• 使用對(duì)象來(lái)優(yōu)化代碼
  如果使用了函數(shù)改造法改造之后，發(fā)現(xiàn)有太多的小函數(shù)，則可以使用對(duì)象將這些函數(shù)串起來(lái)。
  this是函數(shù)和對(duì)象的橋梁，會(huì)用this來(lái)串聯(lián)這個(gè)對(duì)象和所有的函數(shù)，函數(shù)調(diào)用傳參的時(shí)候才能確定this的值，在不同的地方調(diào)用，this的指向不一樣的東西。

一些固定的套路

1. 表驅(qū)動(dòng)編程
2. 自說(shuō)明代碼，把別人關(guān)心的代碼放在顯眼的位置。