this的指向问题（改变this指向）

this的指向问题

函数内的this指向

这些this的指向,是当我们调用函数的时候确定的。调用方式的不同决定了this的指向不同

一般指向我们的调用者.

调用方式	this指向
普通函数调用	window
构造函数调用	实例对象、原型对象里面的方法也指向实例对象
对象方法调用	该方法所属对象
事件绑定方法	绑定事件对象
定时器函数	window
立即执行函数	window

改变函数内部this指向

1.call

call可以调用函数,可以改变函数内的指向

var o = {
	name:'Andy'
};
function fn() {
	console.log(this);  
}
fn(); //window
fn.call(o); // {name:'Andy'}

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('Andy',18,'女');
console.log(son); //Son {uname: "Andy", age: 18, sex: "女"}

2.apply

调用函数，改变函数内部this的指向

 var o = {
 	name:'Andy'
 };
 function fn() {
 	console.log(this);
 }
 fn(); //window
 fn.apply(o); //{name:'Andy'}

参数必须是数组（伪数组）

var o = {
 	name:'Andy'
 };
 function fn(arr) {
 	console.log(this); //{name: "Andy"}
 	console.log(arr); // pink
 }
 fn.apply(o,['pink']); //{name:'Andy'}

apply的主要应用，比如可以利用apply借助于数学内置对象求最大值

var arr = [1,56,23,10];
var res = Math.max.apply(Math,arr); //最好让函数指向函数的调用者
console.log(res); //56

3.bind

bind不会调用原来的函数 可以改变原来函数内部this的指向

fun.bind (thisArg, arg1, arg2, ...)

• thisArg :在fun函数运行时指定的this值
• arg1 , arg2 :传递的其他参数
• 返回由指定的this值和初始化参数改造的原函数拷贝

返回的是原函数改变this后的新函数

var o = {
 	name:'Andy'
 };
function fn() {
	console.log(this);
}
var f = fn.bind(o);
f();  //{name: "Andy"}

如果有的函数不需要立即调用，但又想改变函数内部的this指向时，要用bind

//有一个按钮，点击了之后禁用，3s之后恢复

var btn = document.querySelector('button');
/*btn.onclick = function () {
    this.disabled = true;  //这个this指向的时btn这个按钮
    setTimeout(function () {
    	this.disabled = false; // 定时器里的this 指向window
    },3000)
}*/
btn.onclick = function () {
    this.disabled = true;  //这个this指向的时btn这个按钮
    setTimeout(function () {
    	this.disabled = false; // 此时，定时器里的this指向btn
    }.bind(this),3000) //这个this指向的是btn这个对象
}

总结

相同点:

都可以改变函数内部的this指向.

区别点:

1. call 和apply会调用函数并且改变函数内部this指向.
2. call 和apply传递的参数不一样, call传递参数arg1, arg2.形式apply必须数组形式[arg]
3. bind 不会调用函数可以改变函数内部this指向.

主要应用场景：

1. call 经常做继承.
2. apply经常 跟数组有关系比如借助于数学对象实现数组最大值最小值
3. bind 不调用函数但是还想改变this指向，比如改变定时器内部的this指向.