call,apply,bind

1.相同点

1.1都是用来改变函数的this对象的指向的

1.2第一个参数都是this要指向的对象

1.3都可以利用后续参数进行传参

那么他们的区别在哪里？先看一个例子

var xw = {
   name: '小王',
   gender: '男',
   age: 24,
   say: function( ) {
      alert(this.name+','+this.gender+',今年'+this.age)
   }
}
var xh = {
   name: '小红',
   gender: '女',
   age: 18
}
xw.say();

没什么好说的，弹出的肯定是 小王，男，今年24

那么如何用xw的say方法来显示xh的数据呢？

对于call可以这样:

xw.say.call(xh)

对于apply可以这样:

xw.say.apply(xh)

而对于bind来说需要这样:

xw.say.bind(xh)( )

如果直接写xw.say.bind(xh)是不会有任何结果的，看到区别了吗？call和apply都是对函数的直接调用，而bind方法返回的仍然是一个函数，因此后面还需要()来进行调用才可以

那么call和apply有什么区别呢？我们把例子稍微改写一下。

var xw = {
   name: '小王',
   gender: '男',
   age: 24,
   say: function(school,grade) {
      alert(this.name+','+this.gender+',今年'+this.age+',在'+school+'上'+grade);
   }
}
var xh = {
   name: '小红',
   gender: '女',
   age: 18
}

可以看到say方法内多了2个参数，我们通过call/apply的参数进行参数传递

对于call来说，是这样的

xw.say.call(xh,'实验小学','六年级')

对于apply来说，是这样的

xw.say.apply(xh,['实验小学','五年级'])

看到区别了吗？call后面的参数与say方法中是一一对应的，而apply中的第二个参数是一个数组，数组中的元素是和say方法中一一对应的，这就是两者最大的区别

那么bind怎么传参呢？它可以像call那样进行传参

xw.say.bind(xh,'实验小学','二年级')( )

但是由于bind返回的仍然是一个函数，所以我们可以在调用的时候进行传参

xw.say.bind(xh)('实验小学','六年级')

总结：call、apply、bind都可以改变this对象的指向，call和apply的区别就是参数的不同，call和apply的第一个参数都是this要指向的新对象(新变量/新数据)，call和apply的不同点在于之后的参数(call之后的参数与方法中是一一对应的，而apply之后的参数是一个数组，数组内的数据与方法中是一一对应的)，而bind只是一个函数，还需加上( )进行调用，才可以实现和call相同的操作