React事件为何bind this？

修改方法的this指向，this默认是undefined，this是返回一个新的函数（绑定当前的this）；也可以使用静态方法，this指向当前实例

React事件和DOM事件的区别

1. event是 SyntheticEvent，模拟出来DOM事件所有能力;
2. event.nativeEvent是原生事件对象；
3. 所有的事件都被挂载到document上

React表单知识点串讲

• 受控组件
• input textarea select 用 value
• checkbox radio 用 checked

React父子组件通讯

答：父组件穿方法给子组件,父组件管理数据（状态提升），父组件下发数据，子组件父子渲染

setState为何使用不可变值

• 不可变值 不能直接操作state 不能提前修改state的值
• 可能是异步更新 setState可以传入2个参数，第二个参数是callback，callback中可以拿到最新的state
• 可能会被吞并

setState是同步还是异步

• 在自定义的DOM事件中和setTimeOut中使用setState是同步的
• setState通过一个队列机制来实现state的更新，当执行setState的时候，会将需求更新的state合并后放入状态队列，而不会立刻更新this.state。队列机制可以高效的批量更新state，如果不通过setState而直接修改this.state，那么该state将不会被放入状态队列，当下次调用setState并对状态队列进行合并时，将会忽略之前被直接修改的state，而造成无法预知的错误

React高级特性

• 函数组件
  • 纯函数，输入props，输出jsx
  • 没有实例，没有生命周期，没有state
  • 不能扩展其他方法
• 非受控组件
  • ref
    • React.createRef()
  • defautlValue defaultChecked
    • < Input defaultValue={this.state.value}/> < CheckOut defaultChecked={this.state.checked}/>
  • 使用场景
    • 必须手动操作DOM元素，setState实现不了
    • 文件上传 < input type="file">
    • 某些富文本编辑器，需要传入DOM元素
  • 受控组件 vs 非受控组件
    • 优先使用受控组件，符合React设计原则
    • 必须操作DOM时，再使用非受控组件
• Portals（传送门）
  • 组件默认会按照既定层次嵌套渲染
  • 如何让组件渲染到父组件之外
  • 一般情况下适配一下css不及的场景
• context
  • 公共信息如何传递给每个组件
  • 用props太频繁
  • 用redux小题大做0
• 异步组件
  • import()
  • React.lazy
    • const demoCom = React.lazy= import('../') <Suspense fallback={
      loading
      }>
  • React.Suspense
• 性能优化
  • shouldComponengUpdate
    • React 默认： 父组件更新，子组件无条件也更新
    • 性能优化对于React更加重要
    • SCU一定要每次都用吗？-- 需要的时候才优化
    • 一定要配合不可变值
  • PureComponent \ React.memo
    • PureComponent, SCU中实现了浅比较
    • memo, 函数组件中的PureComponent
    • 浅比较已适用大部分情况
  • 不可变值 immutable.js
    • 彻底拥抱“不可变值”
    • 基于共享数据（不是深拷贝），速度好
    • 有一定的学习和迁移成本，按需使用
• 高阶组件HOC
• Render Props

React高级使用