本文详细解析JavaScript中apply和call方法的作用与区别。两者均用于改变函数执行时的this指向,语法上主要区别在于参数传递方式:call接受离散参数,apply接受参数数组。通过具体代码实例演示了如何利用这两个方法实现对象方法的借用及上下文切换。
call和apply的基本说明
一、call和apply的说明
1、call和apply都是Function.prototype上的内置方法,由JavaScript引擎实现。由于它们定义在Function.prototype上,因此每个Function对象实例(即每个函数)都拥有这两个属性。作为函数的属性,它们的使用场景自然针对函数调用,这两个方法功能相似但使用方式存在差异,容易混淆。
2、语法对比:foo.call(this, arg1, arg2, arg3) 等价于 foo.apply(this, arguments),最终效果等同于 this.foo(arg1, arg2, arg3)。
3、相同点:这两个方法产生的执行作用是完全一致的。
4、不同点:主要区别在于传递参数的形式不同。
apply和call的实例演示
二、实例代码
代码如下:
<script type="text/javascript">
function A(){
this.flag = 'A';
this.tip = function(){
alert(this.flag);
};
}
function B(){
this.flag = 'B';
}
var a = new A();
var b = new B();
//a.tip.call(b);
a.tip.apply(b);
</script>三、代码解释(即说明apply和call作用)
代码执行原理解析
1、实例代码定义了两个构造函数A和B。A中包含flag属性和tip方法(tip属性被赋值为一个函数),B中仅包含一个flag属性。
2、分别创建A和B的实例对象a和b。
3、无论是执行a.tip.call(b)还是a.tip.apply(b),运行结果都是弹出字符串'B'。
4、从结果可以看出,call和apply都允许对象B调用对象A的tip方法,并且成功修改了该方法执行时的this指向,使其指向调用者b。