之前写过JavaScript中this的指向那篇博客中的最后一个关于修改定时器的this指向的时候,其实还有个方法是使用bind()函数来改变,且继承那篇博客中,也有写到call()的方法去将父类的属性传至子类属性中.那么,我们顺带来看看,call、bind以及apply三个函数.
首先,我先解释下,为什么我将这三个函数放在一起写,先叙述下它们的相似之处:
1.他们都是用来改变函数的this对象的指向的.
2.第一个参数都是this要指向的对象.
3.它们都可以利用后续参数来传参.
那他们的区别又在哪里嘞?先看看下面的代码.var yee={
name:‘小李‘, sex:"女", age:23, foo:function(){ alert(this.name+","+this.sex+"年龄"+this.age)} } var gene={ name:"小黄", sex:"女", age:24}
yee.foo();
结果显而易见，一个简单的调用．那么，我们怎么使用yee中的foo()函数来显示gene中的数据呢.（如下）
var yee={ name:‘小李‘, sex:"女", age:23, foo:function(){ alert(this.name+","+this.sex+"年龄"+this.age)} } var gene={ name:"小黄", sex:"女", age:24} yee.foo.call(gene)
于apply而言,也是一样的:
var yee={ name:‘小李‘, sex:"女", age:23, foo:function(){ alert(this.name+","+this.sex+"年龄"+this.age)} } var gene={ name:"小黄", sex:"女", age:24} yee.foo.apply(gene)
但是,bind与apply以及call不相同,看下面:
var yee={ name:‘小李‘, sex:"女", age:23, foo:function(){ alert(this.name+","+this.sex+"年龄"+this.age)} } var gene={ name:"小黄", sex:"女", age:24} yee.foo.bind(gene)();
这样的话，区别应该很明显了吧．call与apply都是对函数直接进行调用,而bind方法返回的仍然是一个函数，因此我们在后面还是需要()来进行调用才可以．
接下来，我们把上述例子改一点点，来看看：
这里,我们将foo方法中多加了两个参数,我们先用call/apply的参数进行传参.
首先,对于call而言,就加上：
yee.foo.call(gene,"成都","林湾村铁道学院")
而对于apply函数而言,是:
yee.foo.apply(gene,["成都","林湾村铁道学院"])
那么,这个区别也可以看出来啦!call后面的参数与say方法中是一一对应的,而apply的第二个参数是一个数组,数组中的元素和foo方法中一一对应,这就是它们之间的区别.
但是，由于bind返回的仍然是一个函数,所以我们还可以在调用时候再进行传参.
yee.foo.bind(gene)("成都","林湾村铁道学院")
那我们在这里再说说如果使用bind()方式如何修改定时器中this的指向吧.这里,或许有人会想问,既然call、apply与bind函数都可以改变this.因为,call与apply再修改this指向后,函数会立即执行,但bind返回的就是一个新的函数,它会创建一个与原来函数主体相同的新韩淑,新函数中的this指向传入的对象.
var name="Window"; var obj={ name:"This is obj", fun:function(){ var time=null; clearInterval(time); time=setInterval(function(){ console.log(this.name);//This is obj }.bind(this),2000) } }
原文：https://www.cnblogs.com/ljylearnsmore/p/14496783.html