call、apply及bind用法解析

JavaScript中的函数也是对象，是一种可以被调用的对象。函数就是对象的一个子类型。 typeof functionName === "object"也说明了这一点。函数对象可以包含方法，我们今天要讨论的是函数的call、apply和bind方法。

• 任何函数可以作为任何对象的方法来调用，哪怕这个函数不是那个对象的方法，函数作为对象的方法调用之后函数内部的this指向被绑定的对象。

• call和apply看做某个对象的方法，通过调用方法的形式来间接调用函数。

• call( )和apply( )的第一个实参是要调用函数的母对象，这两个方法的不同点在于传参的形式不同。

• call( ) 除了第一个参数之外的其他参数就是要传入待调用函数的值。

• apply( ) 传入调用函数的参数放在一个数组中。

• bind这个方法的主要作用的将函数绑定到某个对象。当在函数 f( ) 上调用bind() 方法并传入一个对象o作为参数，这个方法将返回一个新函数。调用新的函数将会把原始的函数f() 当做o的方法来调用。传入新函数的任何实参都将传入原始函数。传入bind()的实参也会被绑定到this.

call和apply方法的例子:

//要想以对象o的方法调用函数f(),并传递参数1，2,可以这样做：
var o = { a : 1 }
function f( x , y ){
	console.log( this.a + x + y )
	return 124
}
//f()函数被执行，this指向对象o,this.a === 1
f.call(o,1,2); //4
//返回值是函数的返回值
var result = f.call(o,1,2) //result === 124
f.call(o,1) //NaN ，未传入y,y为undefined
//调用的对象方法不变
console.log(o); //{a:1}
console.log(o.f === f); //false
f.apply(o,[1,2]); //4

call的应用，字符串直接调用数组的join方法：

//join:将数组的元素根据传入的参数进行拼接返回拼接后的字符串
var a = "foo";
//直接调用时字符串没有join方法
console.log(a.join); //undefined
 //通过call去调用Array对象的方法
var c = Array.prototype.join.call(a, "-");
console.log(c); //f-o-o

bind方法例子:

var sum = function(x, y) {
  console.log(this.a, x, y);
  return this.a + x + y; //this由调用时决定，由下文可知，this指向o对象
};

var o = { a: 1 };

var targeFun = sum.bind(o, 2); //2传入到 x 位置，下面调用传入的3 传入到 y 位置
var m = targeFun(3); //1,2,3
console.log(m); //6

通过call方法，我们可以在不同的上下文环境中去调用不同变量类型所具有的方法。

---

参考：
JavaScript权威指南