这是我参与「第五届青训营 」伴学笔记创作活动的第 8 天

hooks的写法

1.创建副本的意义：
简化复杂功能
跟踪数据改变
确定react在何时重新渲染
2.如果你想写的组件只包含一个 render 方法，并且不包含 state，那么使用函数组件就会更简单
3.每次只要你构建动态列表的时候，都要指定一个合适的key，组件的key并不需要保证全局唯一，只需要在当前的同一级元素之前保证唯一即可
4.hooks:可以挂载到react生命周期执行的一个函数
5.不要在循环，条件，嵌套函数中调用hooks
6.hooks函数基本都是useState和useEffect的封装

react的实现

1.Q:jsx不符合js标准语法
A:转义
2.Q:返回的JSX发生改变时如何更新DOM
A:虚拟DOM,将新旧diff算出来，只改变diff部分,这样耗时就会降到最低，但要注意的是diff算法本身的时间复杂度不能太高，不能太耗时
3.Q什么是虚拟DOM
A：真实DOM不是js内部的属性，是浏览器的对象，我们只能通过操作DOM节点来修改DOM;虚拟DOM（Virtual DOM）是一种用于和真实DOM同步，而在js内存中维护的一个对象，它具有和DOM类似的树状结构，并和DOM可以建立一一对应的关系
4.指令式编程和声明式编程和响应式编程
指令式编程：一步一步告诉程序怎么做
声明式编程：不需要做更底层的东西，仅需要声明 vue\react\agular
响应式编程：在声明式编程的基础上能够自己响应自己
5.弊病：父组件发生改变时，所有的子组件的render函数都会更新
6.Q:How to Diff?
A:完美的最小Diff算法需要O(n^3)的复杂度，牺牲理论最小diff，换取时间，得到局部最优解，得到O(n)复杂度的算法（只遍历了一遍）
从根结点开始比较虚拟DOM和DOM,遇到不同类型的元素，则替换，遇到同类型的DOM元素就更新，遇到同类型的组件元素就继续往下递归

react状态管理库(将状态抽离到UI外部进行统一管理)

1.将状态抽离到UI外部进行统一管理就可以避免根结点上有太多状态、传递链路过长的问题但同时又会产生可复用性低的问题，为了平衡这两个问题，我们将传递链路过过长、偏向业务层的状态放在状态管理库中 2.状态管理库推荐
redux\xstate\mobx\recoil
3.状态机（当前状态，收到外部事件，迁移到下一个状态，如：红绿灯）
cpu可以看作一个状态机
4.modern.js\reduck基于react的全栈开发工具

应用级框架科普

1.next.js vercel
2.modern.js 字节跳动
3.blitz
适合前后端耦合比较高的小团队项目，可直接访问数据库