好程序员分享React-010-事件处理函数的this指向问题，区分普通函数和事件处理函数1.直接调用普通函数。这个指点没有问题，谁叫它，这个指点就是谁。2.普通函数没有事件对象event3。事件处理函数其实就是一个函数，只不过是绑定了一个事件而已。4.事件处理函数的this默认为undefined。解决this指向问题的四种方法1.在绑定事件的地方直接添加.bind(this)指向I2.使用箭头函数{this.handleClick(event);}}点击我3.在构造函数中，执行this{super();指向的绑定constructor();this.handleClick=this.handleClick.bind(this);}render(){return(clickme)}4.使用实验性公共类归档语法。如果要使用，需要babel插件的支持。1.安装@babel/plugin-proposal-class-propertiesbabel插件2.进入babel配置文件配置3.重启项目classAppextendsReact.Component{handleClick=()=>{console.log(this);};}为什么要用bind来修改this点而不是apply调用呢？因为apply和call会直接执行函数，而bind会返回一个新的函数。调用子组件时，需要向下传递一个方法。这个时候这个方法推荐什么样的thisbinding：推荐使用：构造函数中的bind和publicclassfileds语法。1.首先要知道，父组件渲染的时候，子组件肯定会渲染2.我们希望如果子组件没有变化，那么当父组件渲染时，子组件不渲染。保存性能。3.要实现第2点，子组件可以继承PureComponent4和PureComponent。它会帮助我们计算子组件接收到的porps是否发生变化，如果发生变化，则进行渲染。如果不是，防止render//由于.bind()方法每次都会返回一个新的函数，所以不推荐使用这种方法。...{this.handleFn1()}}/>//因为每次执行这行代码，返回的箭头都是新的箭头函数，所以不推荐使用这种方法constructor(){super();this.handleFn1=this.handleFn1.bind(this)}handleFn1=()=>{...}//也推荐这个方法。
