React Hook 是一杯甜的毒酒
本文旨從另一個角度聊一下React Hook
凡事有好有壞, 本文對Hook不好的一面做了提醒, 而非全面否定本文沒有代碼, 只有討論請各位看官悉知 --- 斷空
React 16.8 引入了Hook後, 將class弱化, 推崇function.
將 "一個程序(函數)只做一件事, 並做好" 和 "函數是一等公民" 的思想發揚光大.
而且一直用React的人使用Hook後, 代碼上的確簡化了很多, 所以深受其愛.
一. 函數式編程
Hook到底爽在哪呢?
1. 把通用功能抽取出來啊
2. 每個useEffect可以是個很單一的功能, 哪裡用, 直接搬過去就好了啊3. useState多簡化啊, 比以前setState爽太多了啊
現在想一下, 這些只是 函數 本身帶來的好處.
jQuery剛出現的時候, 簡直是前端開發的福音, 解決了瀏覽器兼容問題, 選擇器不要太爽, 事件綁定用起來也如拾地芥.
但並沒有解決本質問題, 只是工具趁手了.
Angular, React, Vue三架馬車的出現為什麼會帶來這麼大的變革呢?
如果說是SPA, 那jQuery也有ajax啊, 非同步請求有了, 改dom不是jQuery的強項嘛.
我認為是模塊化開發的思想, Angular, React, Vue 把模塊化思想在前端深化並應用.
PS: 誠然 jQuery中也有模塊化的思想, 但大多數人還是用它來直接操作dom
想想你從jQuery到三架馬車時代, 有對前端多了哪些認識嗎?
html, css還在, ajax還在, 多的是 如何模塊化, 怎樣確認模塊間的關係.
而這些是編程通用的基本思想, 不是前端獨有的, 大牛們一直用這些思想, 在各種領域造框架, "玩弄"著我們.
二. 抽象能力
面向過程編程 與 面向對象編程 都有很久的歷史了,
當我們用面向對象編程時, 思考的問題是
- 類如何設計
- 哪些屬性可以放在父類上
- 哪些可以做成實體類
- 哪些操作可以抽象成管理類 等等
類多了之後, 要按功能分層, 那架構就出來了. 新模塊應該加到哪個層里, 什麼功能應該在哪層去做, 就很清晰了.
這就相當於 "超市有了, 以後我們上架一種新薯片時, 自然就會放到零食區, 而不是海鮮區".
達爾文的偉大不是發現了很多種生物, 而是充分分析共性與差異後,
給出了他們的分類: 門 綱 目 科 屬 種.有了這個分類後, 人們可以輕鬆的把新發現的物種劃入其中.
如何分析 共性與差異? 抽象能力.
抽象能力是程序員的基本功, 是我們做架構設計的基礎.
Hook推崇的函數式, 正在讓你放棄這些思考.
結構關係拆散後帶來的靈活性, 是在放棄 分析結構關係 的代價下得到的, 這呼應了文章標題.
三. Typescript
Hook的另一個影響是與 Typescript 的漸行漸遠.
沒了繼承, 沒了裝飾器, 剩下的只有類型推導了吧.
大家可以留言討論下在React里, 除了類型推導, 還用到了ts的哪些特性.
四. 後記: 談談對React的感覺
與其說React是一個前端框架, 倒不如說是一本 <帶你一起做一個前端框架> 的教程
React前期只是View層, 周邊的功能是靠社區來維護.
它象一個前沿實驗室一樣, 不斷的推出新的概念.
而技術出身的程序員, 天然會被這些新概念吸引.
想學習, 想給自己充電的慾望滿滿的, 想學又沒時間怎麼辦, 在項目里用吧, 豈不美哉!
有沒有 追著React新概念不斷重構自己項目 的, 舉個爪~
有沒有看到新概念, 新功能, 不在項目里用上就很難受的, 用上其實對項目實際幫助也不太大的.
大公司人多可以這麼玩, 小公司人手緊, 請不要這麼做.
Vue為什麼火的這麼快, 能快速, 簡單的實現想做的功能, 對小公司和創業公司來講, 是福音.
五. 總結
React是學院派, Angular是沉穩派, Vue是青春派.
做為 "老師" 來講, React非常的合格, 它將各種實現細節暴露給你, 帶著你一起解決框架上的問題.
無論是Angular那種重class的, 還是React這種重function的, 都是解決問題的思路, 只是採用的方法不同.
還是很願意看到這些不同的, 對於前端發展來說, 是好事
在知乎上的第一篇文章
覺得在理的, 請點贊 覺得不妥的, 歡迎拍磚
推薦閱讀：
