因爲我是學前端的，所以就說說前端開發階段的編碼設計問題以及我的成長。
剛開始我寫js代碼，很混亂，功能和算法，數據接受和返回經常放在一起，代碼複用性很差，維護性能也很差，雖然做出的工具能用，但是維護的時間成本非常大，這是我剛開始時候的前端設計能力，工具的第一個版本。
後面隨着工具的使用，因爲產品參數以及算法經常需要添加和修改，我看到維護難度太大，不得已開始重構迭代第二版本。當然了，也是隨着的我的學習進度和能力的提升，發現第一版本的代碼存在着嚴重的缺陷。所以決心重構代碼：
首先就是每個功能進行切割分開來，讓它模塊化，就是事件模塊化，比如下載，導出，這些功能事件裏面不會寫算法和數據的接受返回。就是放置封裝的算法（下面會進行說明）。
其次就是收據的接受和返回單獨一個js文件，賦予接收的變量通過方法封裝返回，或者全局引用。
最後就是最重要的一部分，封裝邏輯和算法，它貫穿前面的幾部分，封裝的方法根據你的需要抽象或者具體化，比如固定的公式算法，可以封裝成一個需要傳入與公式有關的參數的方法，內部可以返回這算法最終得到的一個或者多個結果。我是用this.屬性=結果值進行的，在功能事件模塊中直接new進行實例化，然後對象. 屬性就可以獲取封裝的公式計算的結果。當然也可以根據設計直接在算出的結果集變成json對象，然後拿到渲染界面的邏輯中渲染結果輸出，就實現了，一個方法，到處複用，又不用重複編寫，維護時就在原始的封裝方法中進行添加算法和修改，其他的引用便同步改變了。代碼起碼減少了一半，維護成本大大降低。用專業的術語來說，上面的封裝屬於工廠函數設計的一種模式。
經過上面的幾個步驟，前端的設計有了一個屬於我的初步框架概念，數據處理，算法邏輯處理，功能事件模塊，我的開發把這幾塊都分別用一個js文件，這樣用途分明，在維護時能夠及時定位。有時候開發可能並不能完全按上述進行，但是大體的設計思想是這樣的。讓整個前端項目一目瞭然。
實際上，上面幾個步驟之外應該還有一個視圖模塊，它專門用來集合動態的html標籤代碼，用來動態渲染。我的設計上，如果是重複多的那肯定單獨做一個js。然後結合封裝的邏輯以及算法進行引用。html需要重複書寫的，我一般歸類爲動態，在js中寫，把它當做一個變量引用，而不直接在html文件中寫。
上面屬於我在前端開發的一些感悟，僅代表個人觀點，可能會有很多問題，歡迎大家指出，一起討論提升，謝謝。