弄清JavaScript中call和apply的用法
2012-07-01 08:58 737 0
每一javascript function默认都有一些附带的method,如:Function.call(), Function.apply();这两个方法的作用都是将函数绑定到另外一个对象上去运行，两者仅在定义参数方式有所区别：
apply(thisArg,argArray);
call(thisArg\[,arg1,arg2…\] \]);
即所有函数内部的this指针都会被赋值为thisArg，这可实现将函数作为另外一个对象的方法运行的目的。
1、call()method
通过两个实例说明call()的用法
示例一：
var x = 10;
var o = { x: 15 };
function f() {
alert(this.x);
}
f(); //输出10
f.call(o); //输出15
f() : 直接调用f， 而非通过对象实例的引用进行调用， 此时function f(){}中的this指向的是全局对象，示例中的第一行代码定义了一个全局变量x，因此，此时的this.x即返回全局变量x的值
f.call(o) : 通过Function.call()调用f，并传递了一个全局对象o做为参数，此时function f(){}中的this指向的是call方法传入的第一个参数o，因此，此时的this.x返回的就是对象o中的x属性对应的值
示例二：
var x = 10;
var o = { x: 15 };
function f(message) {
alert(message);
alert(this.x);
}
f("invoking f");
f.call(o, "invoking f via call");
该示例主要演示了通过call()传递参数到目标函数，根据该方法的定义，也可以传递多个参数
知识点：
理解在运行时，function f()中this关键字指向或引用的对象，只有在function f()执行时才能确定
2、apply()method
apply()方法和call()方法类似，区别就在于通过apply()传递参数（第二个参数）时，要求参数必须是数组类型
同样通过两个实例说明apply()的用法
示例一：
var x = 10;
var o = { x: 15 };
function f(message, a) {
alert(message);
alert(a);
alert(this.x);
}
f("invoking f");//输出结果 : "invoking f", "undefined", 10
f.apply(o, \["argFirst","argSecond"\]);//输出结果 : "argFirst", "argSecond", 15
该示例主要演示了apply()和call()的区别，主要最后一行代码apply()方法中的第二个参数是数组类型，目标函数f()在接收参数时，第一个参数对应数组中的第一个元素，第二个参数对应数组中的第二个元素，以此类推。
示例二:
var o = { x: 15 };
function f(message1, message2)
{
alert(message1 + (this.x * this.x) + message2);
}
function g(object, func)
{
// arguments\[0\] == object
// arguments\[1\] == func
var args = \[\]; // empty array
// copy all other arguments we want to "pass through"
for(var i = 2; i < arguments.length; i++)
{
args.push(arguments\[i\]);
}
func.apply(object, args);
}
g(o, f, "The value of x squared = ", ". Wow!");
该示例主要演示了利用apply()要求参数必须是数组的特性,和arguments对象结合编写出灵活优雅的代码
注意: arguments对象并不是数组类型,因此,在for循环中对arguments对象进行了转换
好了,到此call()和apply()两个方法的应用就介绍到此,以上理解主要参考http://odetocode.com/Blogs/scott/archive/2007/07/05/function-apply-and-function-call-in-javascript.aspx后个人进行的总结和记录,以帮助理解,在此向作者表示感谢!
