this的指向
这些this的指向,是当我们调用函数的时候确定的。调用方式的不同决定了this的指向不同。
一般指向我们的调用者.
调用方式 | this指向 |
---|---|
普通函数调用 | window |
构造函数调用 | 实例对象 原型对象里面的方法也指向实例对象 |
对象方法调用 | 该方法所属对象 |
事件绑定方法 | 绑定事件对象 |
定时器函数 | window |
立即执行函数 | window |
this指向的改变
我们也可以改变函数内this的指向,js提供了三种方法 call() ,apply() , bind()
apply()方法:
1.调用函数 ,并且可以改变函数内部的this指向
2.他的参数必须是数组(伪数组)
3.apply的主要应用 比如说我们可以利用 apply 借助于数学内置对象求最大值
const numbers = [5, 6, 2, 3, 7];
const max = Math.max.apply(null, numbers);
console.log(max);// 7
const min = Math.min.apply(null, numbers);
console.log(min);// 2
call()方法:
1.调用函数 ,也可以改变函数内的this指向
2.call() 方法接受的是一个参数列表
3.call 的主要作用可以实现继承
function Father(uname,age,sex){
this.uname = uname;
this.age = age;
this.sex = sex;
}
function Son(uname,age,sex){
Father.call(this,uname,age,sex);
}
var son= new Son('刘德华',18,'男');
console.log(son);
call()方法的作用和 apply() 方法类似,区别就是call()方法接受的是参数列表,而apply()方法接受的是一个参数数组。
bind()方法:
1.不会调用原来的函数 可以改变原来函数内部的this指向
2.返回的是原函数改变this之后产生的新函数
3.如果有的函数我们不需要立即调用,但是又想改变这个函数内部的this,指向此时用bind
例子:我们有一些按钮,当我们点击了之后,就禁用这个按钮,2秒钟之后开启这个按钮
<button>按钮</button>
<button>按钮</button>
<button>按钮</button>
var btns=document.querySelectorAll('button');
for(var i=0;i<btns.length;i++){
btns[i].onclick = function(){
this.disabled = true;
setTimeout(function(){
this.disabled = false;
}.bind(this),2000);
}
}
以上就是关于函数this指向的总结。