本章解决问题:1.这是什么,为什么要引入?2.对this的误解3.this绑定规则和判断4.箭头函数的this绑定1.this是什么,为什么要引入?答:本质:这是JS中的关键字;作用:this的作用是通过指向传递对象的引用;为什么引入:为了更优雅地使用传递对象;使用方法:只有函数才有this的概念,this的指向完全取决于函数的调用方式;注意点:1)这是在运行时绑定的,而不是在编写时绑定的;2)this的绑定只与函数调用方式有关,与声明无关;2.当前对这指向什么的误解是什么?答:this不指向函数的调用者:-也就是说this不简单地指向它的调用者,而是依赖一定的绑定规则进行优先级比较,最终确定this的绑定;this不指向函数本身:(以下面的例子为例)——如果this指向fn,那么最后的cnt应该是2,但结果确实是0;-这里实际上是绑定到widows对象的,所以它没有改变fn的计数;函数fn(){this.count++;}fn.count=0;for(让i=0;i<5;i++){if(i>2){fn(i);}}console.log(fn,count);//03.this绑定规则答案:1)默认绑定:当当前执行函数不调用其对象时,this指向全局对象,即浏览器中的Window对象(非严格)注意:必须是调用函数的对象!如果函数调用了函数,就相当于没有调用;在代码0中:函数调用具有此功能,并且this始终指向Window全局;2)隐式绑定:当函数前面有对象调用它时,this指向离调用函数最近的对象2.1)隐式绑定丢失在特殊情况下,隐式绑定会丢失。最常见的两种类型是:作为参数传递和为变量赋值;丢失后的绑定规则:如果作为函数参数传递丢失,则this直接指向Window全局对象(非严格),与函数this无关;如果变量在分配后丢失,则将其重新固定在新变量上;-在代码1中:作为参数的传递丢失了,它被重新定位到fn1,所以this指向Window;-代码2:变量赋值丢失,重新定位在fn;-代码3中:带有this的函数作为setTimeout的参数传递,this指向Window对象;3)显式绑定就是使用call()apply()和bind()方法手动改变这一点;-代码4中:自己改this点,调用函数;-注意:如果第一个参数为null/undefind,则默认指向Window全局对象;apply和call会执行改变this后的函数,而bind只会返回改变了this的新函数;4)newbindingnew实现构造函数调用时,依次执行以下步骤:1.创建(或构造)一个全新的对象2.这个新对象将执行[[Prototype]]连接。3.这个新对象会绑定到函数调用的this上。4.如果函数没有返回其他对象,new表达式中的函数调用会自动返回这个新对象。第三步,将构造函数的this绑定到新的实例对象上,并调用它,实现属性和方法的继承;-代码5:在new的过程中,this绑定到echo,所以出现echo5)4种绑定的优先级:new绑定>显式绑定>隐式绑定>默认绑定;//code0vara=1functionfoo(){vara=2functioninner(){console.log(this.a)}inner()}foo()//code1varname='planetaryflight';letobj={name:'听风就是风',fn:function(){console.日志(这个。名称);}};functionfn1(param){param();};fn1(obj.fn);//行星飞行//code2varname='行星飞行';letobj={name:'听风是风',fn:function(){console.log(this.name);}};letobj1={name:'timejump'}obj1.fn=obj.fn;obj1.fn();//时间跳转//code3varobj1={a:1}varobj2={a:2,foo1:function(){console.log(this.a)},foo2:function(){setTimeout(function(){console.log(this)console.log(this.a)},0)}}vara=3obj2.foo1()//2obj2.foo2()//3//代码4letobj1={name:'ListenThewindisthewind'};letobj2={name:'timejump'};varname='planetaryflight';functionfn(){console.log(this.name);};fn.cal我(未定义);//行星飞行fn.apply(null);//行星飞行fn.bind(undefined)();//行星飞行//代码5functionFn(){this.name='听风是风';};letecho=newFn();echo.name//听风是风4.箭头函数的this绑定答:记住与箭头函数相关的几条规则:1)箭头函数本身是没有this的,它的this找到最近的上层作用域的this(也就是找到上层作用域的this)功能);2)箭头函数的this指向函数定义时的this,而不是执行时的this(看定义时);3)call、apply和bind不能改变箭头函数this的方向;
