JavaScript中Call、Apply和Bind

在前面我简单的讲过JavaScript中this指向的问题，在这一章，主要对call、apply和bind这三个方法进行区分。

首先，call、apply、bind都是用来重定义this指向的。
注意：这里的bind方法是Javascript方法，而不是jQuery方法。在JQ的bind与今天讲的这个方法相差甚大，详细请看JQ相关文档。

下面先看两个小例子：

var name = 'cy',age= 17;
var obj ={
  name:'ally',
  objAge:this.age,
  myFun:function(){
    console.log( this.name + "年龄" + this.age) ;  
  }
}
console.log(obj.objAge); // 17
obj.myFun() ; // ally年龄undefined

第一个console中this指向Windows。
第二个console中this指向了执行函数obj.myFun()，this指向obj(方法调用中谁调用this指向谁)，所以结果显而易见。

var name="cy";
function show(){
  console.log(this.name)
}
show() ; //cy

全局状态下的普通函数，this指向Windows。

上面的一通造作，让我们感到十分不友好，JavaScript也感到这样的操作十分不便捷，所以就有了call、apply、bind方让，可以随心所欲的改变this的指向。下面就让我们看看这几个方法具体的区别是什么吧

call、apply、bind应发用法上的区别

还是通过几个个小例子来开始我们的探索

例一

var name ='小王' ,age=17;
var obj={
  name:'小张',
  objnAge:this.age,
  myFun:function(){
    console.log(this.name +"年龄" + this.age);
  }
}
var db={
  name:'dream',
  age:99
}

obj.myFun.call(db);　　　　//dream年龄99
obj.myFun.apply(db);　　　 //dream年龄99
obj.myFun.bind(db)();　　　//dream年龄99

以上结果返回都一致！
只是在bind方法的后面加了个括号。由此得出结论，bind 返回的是一个新的函数，你必须调用它才会被执行。

例二 ：对比call 、bind 、 apply 传参情况下

var name ='小王' ,age=17;
var obj={
  name:'小张',
  objnAge:this.age,
  myFun:function(fm,t){
    console.log(this.name +"年龄" + this.age +"来自" +fm + "去往" + t);
  }
}
var db={
  name:'dream',
  age:99
}

obj.myFun.call(db,'成都','上海');　　　　 //dream 年龄 99  来自 成都去往上海
obj.myFun.apply(db,['成都','上海']);        //dream 年龄 99  来自 成都去往上海  
obj.myFun.bind(db,'成都','上海')();         //dream 年龄 99  来自 成都去往上海
obj.myFun.bind(db,['成都','上海'])();　　 //dream 年龄 99  来自 成都,上海去往undefined

微妙的差距！
从上面四个结果不难看出
call 、bind 、 apply 这三个函数的第一个参数都是 this 的指向对象，第二个参数差别就来了：
call的参数是直接放进去的，第二第三第n个参数全都用逗号分隔，直接放到后面 obj.myFun.call(db,'成都', ... ,'string' )；
apply的所有参数都必须放在一个数组里面传进去 obj.myFun.apply(db,['成都', ..., 'string' ]);
bind除了返回是函数以外，它 的参数和call 一样。
　　　　
当然，三者的参数不限定是string类型，允许是各种类型，包括函数 、 object 等等！