call和apply

Posted 蝴蝶纷飞

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了call和apply相关的知识,希望对你有一定的参考价值。

本文根据知乎中一些大佬的回复整理完成,如有更深见解,欢迎加入讨论~~

在js OOP中,经常会这样定义:

function cat(){

}
cat.prototype = {
    food: ‘fish‘,
    say: function(){
        console.log(‘I love ‘ + this.food);
    }        
}

var blackCat = new cat;
blackCat.say(); //I love fish

使用call和apply是为了动态改变this而出现的,当一个对象没有某个方法,但是其他方法有,可以借助call或apply来使用其他对象的方法来操作:

function cat(){

}
cat.prototype = {
    food: ‘fish‘,
    say: function(){
        console.log(‘I love ‘ + this.food);
    }        
}

var blackCat = new cat;
blackCat.say(); //I love fish
var whiteDog = {food: ‘bone‘};
blackCat.say.call(whiteDog); //I love bone

call 和 apply 的区别是,call 需要把参数按顺序传递进去,而 apply 是把参数放在数组中传递。

因此,js 中某个函数的参数数量是不固定的,可以使用 apply,将参数 push 进数组进行传递,也可以使用 arguments 对象来进行遍历获取所有参数;在参数明确知道,数目确定的时候可以使用 call.

举个例子:

通过document.getElementsByTagName 选择的 dom 节点是一种类似于array的对象,但是它不能应用Array 下的 push , pop等方法,我们可以通过:

var domNodes = Array.prototype.slice.call(document.getElementsByTagName(‘*‘));

这样domNodes 就可以使用Array 下所有的方法了。

以上是关于call和apply的主要内容,如果未能解决你的问题,请参考以下文章

apply()方法和call()方法

关于call和apply的使用和区别

call()和apply()方法

关于JS中apply和call详细解答

奇妙JS代码系列call,apply,bind用处整理

call 和 apply方法解析