今天我們不聊性能優(yōu)化，只是從后期維護代碼的角度談談如何優(yōu)雅的書寫代碼
· 為什么需要些可維護性高的代碼 ?
在開發(fā)的過程中，迭代和維護是再正常不過的操作了，那么就必然要閱讀別人的代碼
你有沒有遇到過一些尷尬的事情：
1、看不懂別人的代碼，不知從何下手
2、修改一個功能，得讀兩天代碼，改完發(fā)現(xiàn) bug 最少的時候是修改以前
3、只是修改了一行代碼，發(fā)現(xiàn)控制臺報錯好幾十個...
如果代碼的可維護性高了，那么可以避免很多這些問題
編寫可維護性高的代碼, 從我做起 ^_^
· 什么是可維護性高的代碼 ?
容易理解: 不需要求助源代碼書寫人員，就能看得懂
符合常識: 代碼書寫的自然通透
容易適配: 當數(shù)據(jù)發(fā)生變化的時候，不至于完全重寫
容易擴展: 對于核心功能有可擴展性(適當利用策略模式)
容易調試: 當出現(xiàn)問題的時候，能給出明確且詳細的錯誤提示，可以直接定位問題源
從下面幾點做起：
一、代碼可讀性
· 想要好維護, 那么第一任務就是你寫的代碼要讓別人看得懂
· 因為我們的代碼，當他不運行的時候，就是一個純文本
· 想要讓別人看得懂你寫的一堆文本，那么就要從一切自定義的內容開始做起
二、代碼縮進
· 能區(qū)分是論文還是代碼的第一因素，也是最直觀的因素就是代碼縮進
· 代碼沒有縮進，或者隨機縮進，那么和給你看一篇火星文論文沒有區(qū)別
for (var i = 0; i < 100; i++) {
if (true) {
function fn() {
for (var j = 0; j < 100; j++) {
}
}
for (var j = 0; j < 100; j++) {
}
}
}
· 我們嚴格保持了代碼縮進以后, 雖然代碼意義不一定看得懂, 但是代碼結構我能看得懂了
for (var i = 0; i < 100; i++) {
if (true) {
function fn() {
for (var j = 0; j < 100; j++) {
}
}
for (var j = 0; j < 100; j++) {
}
}
}
· 這個時候就可以嘗試下改一改了
三、注釋
在任何一個語言里面，都是有注釋的
語言規(guī)范里定義注釋，不是為了讓你學了玩的，就是為了讓你對代碼進行一些標注的
大型代碼塊，和大量變量堆積的地方，都要有清楚的注釋，用來表明這個代碼塊或者說這一堆變量是干什么用的，尤其是函數(shù)，盡量做到每一個函數(shù)的前面都有一個說明注釋。
/*
* fn 獲取范圍之間隨機整數(shù)的函數(shù)
* @param {Number} a 范圍開始的數(shù)字
* @param {Number} b 范圍結束的數(shù)字
* @return {Number} 范圍內的隨機整數(shù)
*/
function fn(a, b) { ... }
o 每一個函數(shù)都應該有參數(shù)說明，是否有返回值，返回值是什么
o 因為這些內容在函數(shù)定義中是不能直觀看到了，需要閱讀代碼才可以
o 當你寫明了這些以后，閱讀性就大大提高了
o 假設，你的函數(shù)塊里面涉及到很復雜的算法，最好也是在說明注釋里面標注出來
當你對于一些瀏覽器問題做出的修復，你使用了一些黑科技
o 那么你一定要把這些黑科技標注出來，避免別人修改你的代碼的時候
o 覺得這些黑科技沒有用，給你刪掉了，導致你修改好的問題又重新出現(xiàn)了
四、變量和函數(shù)命名
變量的命名和函數(shù)的命名，是最能體現(xiàn)我們自定義的地方
對于每一個變量和函數(shù)的命名，我們都盡量準確的給到一個語義，不管你是使用 大駝峰 還是 小駝峰，都要保證看到名字就能知道這個變量或者函數(shù)的意義
從變量來說
1、盡量使用名詞，而不是動詞
比如：car / person / show / ...
2、常量來說，要使用大寫字母來表示
比如：TEST / BROWSER / ...
3、區(qū)分全局和私有變量，函數(shù)內的私有變量我會以 _ 開頭
比如： _this / ...
從函數(shù)來說
1、當函數(shù)返回布爾值的時候, 一般會以 is 開頭
比如：isEnabled() / isSelected() / ...
2、獲取類的函數(shù)一般以 get 開頭
比如：getUserList() / getUserInfo() / ...
3、設置類的一般使用 set 開頭
比如：setName() / setUserInfo() / ...
4、修改類的一般使用 update 開頭
比如：updateName() / updatePrice() / ...
4、程序處理類函數(shù)使用 handler 結尾
比如：showEditHandler() / submitHandler() / ...
5、盡可能的通過名字描述清楚函數(shù)的作用，不用擔心太長，因為后期打包工具會幫我們處理掉的
比如： getUserInfoById() / delGoodsParamsById() / ...
京公網安備 11010802030320號