前端摩爾定律，每隔18個月，前端難度難一倍。
確實是這樣。。想當初只用jquery一個一個趕頁面是多么……
接觸了一些前端框架，他們都是為了解決了一些特定的場景而生，一堆一堆的api要記，前端學習成本一個一個框架就上去了。
不要盲目的追框架，如果它提高你工作效率就用，如果不能那為什么要用？框架還有學習成本和踩坑成本，原生維護成本相對較高。復用就是一個提高工作效率的一個點。
框架和原生都可以表現出復用的思想，太簡單的復用就不講了，聽過一些大神們的分享之后，我想談一下組件級的復用的思考。最近不是流行web components么。
1，關於原生
原生js，html搭建的網頁是蠻難維護的，比如一個表單驗證，一大堆if else肯定以后維護或者添加功能上面就麻煩很多。
原生的復用也就是代碼復用，把代碼功能抽象出來，表單驗證的功能都類似吧？把功能抽象到方法，比如驗證字符串的個數，compare，密碼是不是相等，郵箱，手機的驗證，正則表達式的驗證。
傳參驗證。每次我只需要定義驗證規則和傳入input的值就可以。這樣一個驗證的類，我就把今生所需要寫的所有表單驗證的邏輯寫完了。
項目有兩個頁面需要驗證，不要寫2遍if else，調用這個類，傳相應參數。
加功能怎么辦，拓展類，拓展規則。這樣，你原來的代碼不用改，你不需要知道以前一堆jq是什么鬼，你只需要拓展這個類就可以了。一種好的代碼規范就是拓展而不是修改。
2，angularjs
我們不盲目崇拜框架，我有原生的一套js驗證，好，那么我angular也調用這個類。angular好的實踐就是在controller里面不要加太多業務邏輯和dom操作。如果我們想復用就別讓它依賴當前controller。
angular的指令分裝飾型指令和組件。一般復用就要組件不依賴外部環境，這樣你才能把這個指令用到任何地方。我們把該指令分離，他需要的數據通過屬性傳進去，類似vue和react的props，
然后內部就是操作自身邏輯，我們需要復用邏輯，把“臟”東西扔出去。這點angular做的不是很好，angular1.*並沒有講組件這個概念，這點會在ng2中有所改變。
一個angular組件，數據在屬性中傳遞，中心驗證我還用原來的那套。比如一個組件
<verify name="username" verify-type="string" model-type="class" />
一個驗證組件就類似這樣，我要顯示的組件名比如用戶名，我傳一個username，我要驗證的類型，比如我驗證它是不是字符串，用一個verify-type傳入string，通過那套js驗證后返回驗證結果。
驗證結果可以用個form-error的指令來封裝一個錯誤類型的指令。每次出錯都復用這個指令，當然出錯信息props傳入。最后可以定制model-type，指令的樣式，傳入一個js對象，可以定制。
3.reactjs
react就提倡的web components，它的每個部分都是一個組件，當然數據是props傳入的，他都給想好了。這個組件就比較好復用了，它維護自身的state，一個組件一個state，兩個組件基本上沒有任何的耦合。那么復用就好做多了。組件的通信就通過props，子與父組件的通信就需要全局的事件系統了。react復用是做的很好了，但是它沒有雙向綁定，驗證表單寫起來較ng麻煩一點，組件間的通信也很麻煩。所以寫react應用的時候，子組件一般就充當渲染組件，上面傳什么參數我渲染什么，而且react組件不要嵌套太深，好的實踐是扁平化，如果用了redux,就會發現如果嵌套太多組件，state是很難維護的。
總結：隨便閑扯了幾句，主要是希望我們工作效率能夠提高，我只需要寫html給它傳遞相關屬性來定制一套頁面，這是多么爽，一句js也不用寫，頁面就寫完了，功能和風格都是統一的，而且它還是好維護的。純理論，希望以后根據公司業務邏輯寫一套自己的開發框架，用公司的ui庫，達到自己“不寫”頁面的目標……