This,caller,和react在

this和caller的区别中失去了this。这代表函数的调用者。谁调用函数。这是来电者代表的人。就是函数的执行环境，函数在哪个作用域。在执行过程中，调用者是谁，注意区分：调用者和执行环境不是一回事constobj={a:function(){控制台日志（这个）；console.log(obj.a.caller)}}functionb(){obj.a()}b()方法a在函数B中执行，所以调用者返回函数B但是方法a是通过obj调用的，所以这个返回obj并将其替换为回调方法a:constobj={a:function(){console.log(this);console.log(obj.a.caller)}}functionb(cb){cb()}b(obj.a)methoda，仍然在函数B中执行，所以调用者仍然返回函数B但是此时方法a不是直接通过obj调用，而是通过obj.a找到函数a，将函数a赋值给函数b的参数cb，然后执行cb()，也就是所谓的回调函数。此时方法a直接作为回调执行，没有被调用者，js会使用顶层对象作为调用者，所以this指向window。因此，函数只要在一定范围内执行，它的执行环境就永远不会改变，但它的调用者会根据调用方式随时改变。这是丢失了。前面说了，不同的调用方式，函数的调用者，也就是this，是会随时变化的。这就是为什么this在js中会丢失的原因。constobj={name:'hh',a:function(){console.log(this)}}obj.a()通过obj对象调用a方法，a方法的调用者是obj对象，所以a方法中的this就是obj对象constobj={name:'hh',a:function(){console.log(this)}}constb=obj.ab()constb=obj.a是为了将obj中的函数a赋值给变量b。此时变量b的值在obj.a中，此时b()直接执行，没有任何调用者。函数中的this会按照JS的规则指向顶级对象窗口。如果使用[strictmode]，this将不再指向window，而是undefined"usestrict"；constobj={name:'hh',a:function(){console.log(this)}}constb=obj.ab()This在reactclassAppextendsComponent{handle=function(){console.日志（这个）；}render(){return(<>button)}}react中的事件绑定当然不是把事件处理器绑定到onclick事件那么简单在本机JS中。onClick={this.handle}其实就是一个赋值操作。App类中的handle函数被分配给onClick变量。当点击事件被触发时，真正执行的是onClick()。react中的onClick()不是JS中的原生点击事件，因为原生事件函数中的this应该指向事件源dom对象；而react中的onClick是全局作用域Execute中的合成事件，没有调用者，所以内部this指向window，因为使用class语法，默认采用严格模式，所以this指向undefined，遵循CC4.0BY-SA版权协议，转载请附上原文出处链接及本声明。