如何真正寫出高內聚低耦合的代碼？如何使代碼符合巴拉巴拉原則？

巴拉巴拉原則代指各類使代碼更優雅的原則

寫代碼的人都但願代碼整潔漂亮，也確定搜索過很多文章，想要學到高內聚低耦合、開閉原則等等等等心法。可是真正動手開始寫時，把本身知道的各類技巧都用上，卻總以爲代碼並不符合這些原則。令人無故產生一種挫敗感：我懂得了這麼多道理，卻寫不出好代碼。

由於這是一個量變產生質變的過程。只有當你畫出最後一筆，你畫的人才看起來是我的。有一個單詞不認識和全部單詞都不認識是沒有本質區別的，可是所有單詞都認識的那一刻，就忽然能夠理解整句話了。只有當你鍵盤下的代碼的方方面面都足夠好，你的代碼纔是真正符合巴拉巴拉原則的。

而網上的大部分文章只會告訴你什麼是巴拉巴拉原則，卻對若是作到閉口不談。

要作到這一點，必須審視本身寫下的每一行代碼：

1. 嵌套的if else好嗎？
2. 能不能不過於依賴if else來實現流程控制？
3. 狀態變量定義在方法外，是否致使程序的語義更模糊了？
4. 這個for循環可否用函數時變成代替？
5. 可否用函數柯里化簡化參數傳遞和方法調用？
6. 可否用閉包使邏輯更內聚力，避免邏輯分散在不一樣方法中？

   ……

   等等等等

無數個這樣的小技巧組成了符合巴拉巴拉原則的代碼。

每一次應用這些小技巧，都致使代碼的巴拉巴拉指數增加了一點。當應用了世界上全部的這種小技巧時，就能寫出巴拉巴拉指數滿分的代碼。

也就是說，這是一個積累的過程，當積累到足夠多的小技巧時，代碼就會趨於完美。

畢竟，連大廠如Facebook，從mixin到High order component到render props到Hooks，連他們都在掙扎尋找實現巴拉巴拉原則的技巧。廣大業務代碼編寫人員以爲迷茫，更是很天然的事情。

不過，不一樣於上面列舉的例子，也存在一些會顯著影響代碼質量的技巧。

目前前端框架，把數據和UI分開。更改數據，UI就會自動更新。這裏面缺乏了框架做者不會關心，業務代碼編寫人員卻每天面對的一塊：業務邏輯寫在哪裏？

以Vue爲例：

寫在Vue的組件裏會致使業務邏輯和UI強耦合，並致使業務邏輯被迫按照頁面的不一樣被分散在不一樣的UI組件中。

致使目前最多見的代碼寫法，不只不符合巴拉巴拉原則，反而符合反巴拉巴拉原則。

正確的作法應該是UI組件裏只存在UI相關的邏輯。業務邏輯所有寫到Vuex裏面，UI組件只負責發佈action和mutation高速Vuex改更新了。

這樣作，UI組件會天然按照設計師的設計分散在不一樣的組件裏。業務邏輯也會按照產品的設計分散在不一樣的Vuex模塊裏。並且，由於高內聚的業務邏輯代碼，本來因爲低內聚高耦合代碼致使的難以維護不復存在，寫新需求、debug過程會變得十分天然。

具體寫法，能夠去看看Vue-element-admin模版源碼。