对于apply()与call()方法,先看其定义:
apply()
语法: functionObject.apply([thisObject,[,argArray]]);
参数 | 描述 |
---|---|
thisObject | 可选/Object类型指定执行functionObject函数时,函数内部this指针引用的对象。 |
argsArray | 可选/Array argumens对象调用functionObject函数时所传入的参数数组或arguments对象。 |
结合《javascript高级程序设计》,我们来看看实例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
function sum(num1,num2){
return num1+num2;
}
function callSum1(num1,num2){
return sum.apply(this,arguments);
}
function callSum2(num1,num2){
return sum.apply(this,[num1,num2]);
}
document.write(callSum1(10,20));
document.write("<br>");
document.write(callSum2(20,20));
</script>
</body>
</html>
ouput:
30
40
为了更好的理解apply()这个方法,在此我再简化一下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
function sum(num1,num2){
return num1+num2;
}
function callSum1(){
return sum.apply(this,arguments);
}
document.write(callSum1(10,20));
</script>
</body>
</html>
output:
30
从上述两段代码的对比中可以发现:我在callSum1中没有带参数,照样可以输出结果,说到这里还是apply()中的this指针起了作用,this指针直接将要返回的结果函数指向了函数sun,所以结果照样输出。
call()
定义:
call()函数用于调用当前函数functionObject,并可同时使用指定对象thisObj作为本次执行时functionObject函数内部的this指针引用。
语法:
functionObject.call( [ thisObj [, arg1 [, arg2 [, args...]]]] )
参数
参数 | 描述 |
---|---|
thisObj | 可选/Object类型指定执行functionObject函数时,函数内部this指针引用的对象。 |
arg1 | 可选/任意类型调用functionObject函数时传入的第1个参数。 |
arg2 | 可选/任意类型调用functionObject函数时传入的第2个参数。 |
args | 可选/任意类型调用functionObject函数时传入的更多参数,可以有多个。 |
如果为该函数所属的functionObject对象提供了传入参数,则必须提供thisObj参数。
返回值
call()方法的返回值为任意类型,其返回值取决于当前functionObject对象的返回值。
name = "张三";
age = 18;
function test(){
document.writeln(this);
document.writeln(this.name);
document.writeln(this.age);
};
// 全局函数内部的this默认为全局对象window
test(); // [object Window] 张三 18
var obj = {name: "李四", age: 20};
// 更改内部的this指针引用对象为obj
test.call(obj); // [object Object] 李四 20
function foo(a, b){
document.writeln(this.name);
document.writeln(a);
document.writeln(b);
}
// 改变this引用为obj,同时传递两个参数
foo.call(obj, 12, true); // 李四 12 true
function bar(a, b){
var o = {name: "王五"};
// 调用foo()函数,并改变其this为对象o,传入参数a,b作为其参数
foo.call(o, a, b);
}
bar("CodePlayer", "www.365mini.com"); // 王五 CodePlayer www.365mini.com
参考资料: