异步更新
原因
1设置为异步提升性能 如果setState每次调用直接执行，会造成 render 函数被频繁执行 ，页面重新被渲染 解决：异步批处理
2如果render函数未执行时，保证props和state一致性
拿到最新state的方法
法一:setState（）中第二个数据是一个回调函数，通过这个回调函数拿到最新的数据
法二:componentDidUpdate()获取到最新的数据
先执行声明周期函数在执行回调函数的
在版本17之前有同步更新
情况一:在setTimeout()中
情况二：在原生dom事件中
进行合并
输出的值为1 仅进行一次加1操作
如何避免：使用函数式更新
原因：在setState源码中进行判断，是函数的话会进行call方法的调用，不是进行合并
React的更新机制
JSX => 虚拟dom =>真实dom
更新 state或者props改变 => render函数重新执行 => 比较新旧虚拟dom树的差别 =>做出更新
diff算法 将比较两颗树的时间复杂度优化到了O(n)的数量级
1.同级比较，不夸层 2。类型不同直接删除 3.引入key值‘
’
key值 尾插时性能优化不大，在中间插入时引入key值用来匹配确定唯一元素
嵌套组件的render被调用 父组件渲染引起子组件更新
解决方法 更新阶段函数 shouldComponentUpdate
// 阻断更新函数shouldComponentUpdate(nextProps,nextState){if(this.state.counter!=nextState.counter){return true}return false}
每个类里都需要 手写shouldComponentUpdate()函数
解决方法 类组件继承PureComponent 会自动进行浅比较生成shouldComponentUpdate
原理：更新时shouldCompenontUpdate决定组件是否在render时更新
源码里面判断是否用户自己定义了compenontUpdate函数
而在pureComponent中如果继承自这个，没有走上面的流程而是进行一次浅比较
进行state和props的浅层比较 如果没有的话就不更新 return false
