本文旨从另一个角度聊一下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还在, 多的是 如何模块化, 怎样确认模块间的关系.

而这些是编程通用的基本思想, 不是前端独有的, 大牛们一直用这些思想, 在各种领域造框架, "玩弄"著我们.

二. 抽象能力

面向过程编程面向对象编程 都有很久的历史了,

当我们用面向对象编程时, 思考的问题是

  1. 类如何设计
  2. 哪些属性可以放在父类上
  3. 哪些可以做成实体类
  4. 哪些操作可以抽象成管理类 等等

类多了之后, 要按功能分层, 那架构就出来了. 新模块应该加到哪个层里, 什么功能应该在哪层去做, 就很清晰了.

这就相当于 "超市有了, 以后我们上架一种新薯片时, 自然就会放到零食区, 而不是海鲜区".

达尔文的伟大不是发现了很多种生物, 而是充分分析共性与差异后,

给出了他们的分类: 门 纲 目 科 属 种.

有了这个分类后, 人们可以轻松的把新发现的物种划入其中.

如何分析 共性差异? 抽象能力.

抽象能力是程序员的基本功, 是我们做架构设计的基础.

Hook推崇的函数式, 正在让你放弃这些思考.

结构关系拆散后带来的灵活性, 是在放弃 分析结构关系 的代价下得到的, 这呼应了文章标题.

三. Typescript

Hook的另一个影响是与 Typescript 的渐行渐远.

没了继承, 没了装饰器, 剩下的只有类型推导了吧.

大家可以留言讨论下在React里, 除了类型推导, 还用到了ts的哪些特性.

四. 后记: 谈谈对React的感觉

与其说React是一个前端框架, 倒不如说是一本 <带你一起做一个前端框架> 的教程

React前期只是View层, 周边的功能是靠社区来维护.

它象一个前沿实验室一样, 不断的推出新的概念.

而技术出身的程序员, 天然会被这些新概念吸引.

想学习, 想给自己充电的欲望满满的, 想学又没时间怎么办, 在项目里用吧, 岂不美哉!

有没有 追著React新概念不断重构自己项目 的, 举个爪~

有没有看到新概念, 新功能, 不在项目里用上就很难受的, 用上其实对项目实际帮助也不太大的.

大公司人多可以这么玩, 小公司人手紧, 请不要这么做.

Vue为什么火的这么快, 能快速, 简单的实现想做的功能, 对小公司和创业公司来讲, 是福音.

五. 总结

React是学院派, Angular是沉稳派, Vue是青春派.

做为 "老师" 来讲, React非常的合格, 它将各种实现细节暴露给你, 带著你一起解决框架上的问题.

无论是Angular那种重class的, 还是React这种重function的, 都是解决问题的思路, 只是采用的方法不同.

还是很愿意看到这些不同的, 对于前端发展来说, 是好事

在知乎上的第一篇文章

觉得在理的, 请点赞 觉得不妥的, 欢迎拍砖

推荐阅读:

相关文章