前端開發中的程式碼藝術(精要)

圖靈大盜發表於2019-02-22

程式碼中特殊的註釋技術——TODO、FIXME和XXX的用處

  • TODO : Stuff I haven’t gotten around to yet
  • FIXME : Known-broken code here
  • HACK : Adimittedly inelegant solution to a problem
  • XXX : Danger! Major problem here

TODO: + 說明: 如果程式碼中有該標識,說明在標識處有功能程式碼待編寫,待實現的功能在說明中會簡略說明。

FIXME: + 說明: 如果程式碼中有該標識,說明標識處程式碼需要修正,甚至程式碼是錯誤的,不能工作,需要修復,如何修正會在說明中簡略說明。

XXX: + 說明: 如果程式碼中有該標識,說明標識處程式碼雖然實現了功能,但是實現的方法有待商榷,希望將來能改進,要改進的地方會在說明中簡略說明。

你必須學會編寫優秀的 js 程式碼之程式設計習慣

你必須學會編寫優秀的 js 程式碼之程式設計習慣

  • 異常處理

如果你沒有使用異常處理的習慣,這可能是因為你並未真正的理解它的作用。當你正確使用異常處理之後,你會發現你的程式碼最顯著的變化就是:少了很多的 if-else 語句 。

前端開發中的程式碼藝術(精要)

  • 事件處理

有經驗的開發者一定會知道,隨著專案內容增多的時候,程式碼裡面的事件處理程式會特別多,如果沒有良好的管理,應用邏輯會和事件處理程式緊密的耦合在一起,而且這時的程式碼會有很大的冗餘。為了解決這種問題,我建議大家採用以下3個方法:

1、隔離應用邏輯 2、禁止分發物件 3、定義事件註冊模組。

  1. 隔離應用邏輯:將應用邏輯從所有事件處理程式中抽離出來是最佳的方法,因為你不知道接下來什麼時候還會觸發同一段的邏輯。
  2. 禁止分發物件:既然應用邏輯和事件處理程式是完全隔離的,那麼應用程式中就不能有任何與事件有關的程式碼,所以,應用邏輯不能依賴於 event 物件來實現某一功能。
  3. 定義事件註冊模組:整個時代都在提倡 js 程式碼統一模組化管理,所以,為了方便管理,我們有必要定義一個事件註冊模組,用來統一完成事件的註冊( 繫結 ) 和 移除
  • 配置分離

我們都很有必要抽離出配置項,並且定義在 Config 配置模組中。(需要自己自定義一個 Config 配置模組,程式碼就不用演示了吧。。。)

  • 職責單一

程式碼應該是一次只完成一個任務

  • 準確具體的命名

變數名中應包含更多資訊,避免通用的詞(tmp->tmp_file) Boolean型變數命名,通常,給Boolean型變數新增is、has、can、should可以讓含義更清晰

  • 註釋——記錄你的想法
  1. 註釋應該記錄你思考程式碼怎麼寫的結果
  2. 也可以用來記錄流程和常量
  3. 當別人讀你的程式碼時,讓他們產生疑問的部分,就是你應該註釋的地方
  4. 說明可能陷阱(你在寫程式碼的過程中,可能用到一些hack,或者有其他需要讀程式碼的人知道的陷阱)
  • 簡化迴圈和邏輯

讓條件語句、迴圈以及其他控制流程的程式碼儘可能自然,讓讀者在閱讀過程中不需要停頓思考或者在回頭查詢,是這一節的目的。

  1. 正向的邏輯在前,比如if(debug)就比if(!debug)好
  2. 簡單邏輯的在前,這樣if和else就可以在一個螢幕顯示 – 有趣、清晰的邏輯在前
  3. 對不符合的條件,儘早return,可以讓邏輯更加清晰.(儘早return,在迴圈中就用continue)

相關文章