JavaScript call、apply详解

一、方法定义

1.call方法

function.call(thisArg, arg1, arg2, ...)
参数 thisArg可选项，将被用作当前对象(function)的对象。 arg1, arg2, , argN 可选项，将被用作方法参数序列。
　　说明
　　call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisArg指定的新对象。
　　如果没有提供 thisArg参数，那么 Global 对象被用作thisArg。

2.apply方法定义

function.apply(thisArg, [argsArray])
应用某一对象的一个方法，用另一个对象替换当前对象。
　　说明：
　　如果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。
　　如果没有提供 argArray 和 thisArg任何一个参数，那么 Global 对象将被用作 thisArg， 并且无法被传递任何参数。

二、实例讲解

1.应用实例

<input type="text" id="text" value="input text">
<script>
   function Obj(){this.value="对象！";}
   var value="global 变量";
   function Fun1(){alert(this.value);}

   window.Fun1();   //global 变量
   Fun1.call(window);  //global 变量
   Fun1.call(document.getElementById('myText'));  //global 变量
   Fun1.call(document.getElementById('text'));  //input text
   Fun1.call(new Obj());   //对象！
</script>

<script>
  var func=new function(){this.a="func"}
  var myfunc=function(x){
       this.a="myfunc";
       alert(this.a);//myfunc，myfunc覆盖了func
       alert(x);//var
   }
   myfunc.call(func,"var");
</script>

对于apply和call两者在作用上是相同的，但两者在参数上有区别的。
　　第一个参数意义都一样。第二个参数：apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入，而call则作为call的参数传入（从第二个参数开始）。
　　如 func.call(func1,var1,var2,var3) 对应的apply写法为：func.apply(func1,[var1,var2,var3])，同时使用apply的好处是可以直接将当前函数的arguments对象作为apply的第二个参数传入。

2.继承实例

function Product(name, price) {
  this.name = name;
  this.price = price;
}
function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}
function Toy(name, price) {
  Product.call(this, name, price);
  this.category = 'toy';
}
var cheese = new Food('feta', 5);
var fun = new Toy('robot', 40);
alert(cheese.name);//feta
alert(fun.name);//robot

上面的例子可以看出，通过call之后，Food、Toy可以继承到Product的方法和属性。

3.实例三

function greet() {
  var reply = [this.person, 'Is An Awesome', this.role].join(' ');
  alert(reply);//Douglas Crockford Is An Awesome Javascript Developer
}
var i = {
  person: 'Douglas Crockford', role: 'Javascript Developer'
};
greet.call(i); 

greet.call(i)，执行greet函数时上下文环境this指向i(对象)。

三、总结

call、apply使用的场景是方法调用对象，这时当前执行上下文环境this是调用的对象。