本章解决问题:1. this是什么,为何引入?2. 对于this的误会3. this绑定规定和断定
1、this是什么,为何引入?
答:
- 实质:this是JS中的一个关键字;
- 作用:this的作用是通过指向来传递对象的援用;
- 为何引入:为了更优雅的传递对象的应用;
- 如何应用:只有函数才有this相干概念,this的指向齐全取决函数的调用形式;
- 留神点:
1)this是在运行时绑定的,而非编写时;2)this的绑定只与函数调用形式无关,与申明无任何关系;
2、目前对于this指向有何误会?
答:
- this并不是指向函数的调用者:
-也就是说this并不是单纯的指向它的调用者,而是依附肯定的绑定规定进行优先级的比拟,最终决定this的绑定; - this并不指向函数自身: (以上面的一个例子为例)
-如果this指向的是fn,那么最终的cnt应该是2,但后果确是0;
-理论这里的this绑定的是widows对象,所以没扭转fn的count;
function fn () { this.count ++ ;}fn.count = 0;for(let i = 0;i<5;i++){ if(i > 2) { fn(i); }}console.log(fn,count); // 0
3、this绑定规定
答:
1)默认绑定:以后执行函数没有下级的时候,this指向全局对象,在浏览器中就是Window对象(非strict)
2)隐式绑定:
当函数后面有调用它的对象时,this指向调用函数最近的对象
2.1)隐式绑定的失落
在非凡状况下隐式绑定会失落,最常见的两种:作为参数传递和最为变量赋值; - 隐式绑定失落时,this视为*寄托*在新的函数中从新定位,如下: - 代码1中:作为参数传递失落,从新定位在fn1上,所以this指向Window; - 代码2中:变量赋值失落,从新定位在fn上;
3)显式绑定
就是应用call()apply()和bind()办法手动的扭转this的指向; - 代码3中:本人扭转this的指向并调用函数; - 留神:若第一个参数是null/undefind,默认指向Window全局对象;
4)new绑定
当new来实现结构函数调用时,顺次执行以下几步: 1. 创立(或者说结构)一个全新的对象。 2. 这个新对象会被执行[[原型]]连贯。 3. 这个新对象会绑定到函数调用的this。 4. 如果函数没有返回其余对象,那么new表达式中的函数调用会主动返回这个新对象。 其中的第三步,就是把构造函数的this绑定到新的实例对象上并调用,实现属性和办法的继承; - 代码5中:new的过程中this绑定到echo上,因而echo上呈现了name属性;
5)4个绑定的优先级:
new绑定 > 显式绑定 > 隐式绑定 > 默认绑定;
//代码1var name = '行星航行';let obj = { name: '听风是风', fn: function () { console.log(this.name); }};function fn1(param) { param();};fn1(obj.fn);//行星航行
//代码2var name = '行星航行';let obj = { name: '听风是风', fn: function () { console.log(this.name); }};let obj1 = { name: '工夫跳跃'}obj1.fn = obj.fn;obj1.fn(); //工夫跳跃
// 代码3let obj1 = { name: '听风是风'};let obj2 = { name: '工夫跳跃'};var name = '行星航行';function fn() { console.log(this.name);};fn.call(undefined); //行星航行fn.apply(null); //行星航行fn.bind(undefined)(); //行星航行
//代码5function Fn(){ this.name = '听风是风';};let echo = new Fn();echo.name//听风是风