Tuesday, 18 August 2015

如何理解和熟练运用js中的call及apply?

老衲电灯
#call方法:
#语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 
#定义:调用一个对象的一个方法,以另一个对象替换当前对象。 
#说明:call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下
#文从初始的上下文改变为由 thisObj 指定的新对象。 
#如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。 
obj.call(thisObj, arg1, arg2, ...);

#apply方法: 
#语法:apply([thisObj[,argArray]]) 
#定义:应用某一对象的一个方法,用另一个对象替换当前对象。 
#说明:如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。 
#如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj,
# 并且无法被传递任何参数。
obj.apply(thisObj, [arg1, arg2, ...]);

两者作用一致,都是把obj(即this)绑定到thisObj,这时候thisObj具备了obj的属性和方法。或者说thisObj『继承』了obj的属性和方法。

唯一区别是apply接受的是数组参数,call接受的是连续参数。

function add(j, k){
    return j+k;
}

function sub(j, k){
    return j-k;
}

我们在控制台运行:

add(5,3); //8
add.call(sub, 5, 3); //8
add.apply(sub, [5, 3]); //8

sub(5, 3); //2
sub.call(add, 5, 3); //2
sub.apply(add, [5, 3]); //2

通过call和apply,我们可以实现对象继承。示例:

var Parent = function(){
    this.name = "yjc";
    this.age = 22;
}

var child = {};

console.log(child);//Object {} ,空对象

Parent.call(child);

console.log(child); //Object {name: "yjc", age: 22}

以上实现了对象的继承。