首页 > JS&HTML > javascript 函数的方法call()和apply()

javascript 函数的方法call()和apply()

上文提到,函数也是javascript的对象,那么同样也有自己的方法。现在就来简单介绍一下call()方法和apply()方法。

本文主要参考:xiaofeizm55333童鞋的javaScript 中 call 函数的用法说明

call()和apply()的第一个参数都是要调用的函数的对象,在函数体内这一参数是关键字this的值。

call()的剩余参数是传递给要调用的函数的值。

结构如下:call([thisObj[,arg1[, arg2[, [,.argN]]]]])

看完下面原作者列出的代码可以解释如下,call()方法就是要用thisObj里的属性或参数,调用call()方法前面的那个对象(函数)的方法

说的通俗一些就是

call()方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

function add(a,b)
{
    alert(a+b);
}
function sub(a,b)
{
    alert(a-b);
}

add.call(sub,3,1);

即add代替sub来接受3和1这两个参数,其等同于add(3,1)

更为复杂些的代码反而更容易理解,让我们看一下这个东西是怎么运行的吧

function Class1()
{
    this.name = "class1";

    this.showNam = function()
    {
        alert(this.name);
    }
}

function Class2()
{
    this.name = "class2";
}

var c1 = new Class1();
var c2 = new Class2();

c1.showNam.call(c2);

call 的意思是把 c1 的方法放到c2上执行,原来c2是没有showNam() 方法,现在是把c1 的showNam()方法放到 c2 上来执行,所以this.name 应该是 class2,执行的结果就是 :alert(”class2″);

我倒感觉这句可以这么理解一下,c1执行showName方法,只不过其中的this被对象c2给代替了

call()还可以实现继承,继续看原贴的代码,

function Class1()
{
    this.showTxt = function(txt)
    {
        alert(txt);
    }
}

function Class2()
{
    Class1.call(this);
}

var c2 = new Class2();

c2.showTxt("cc");

Class2里面调用了Class1的call()方法,这里的this已经是c2了。那么就相当于c1.showText.call(c2,’cc’);和上面解释相同,不重复了。

call()还可以实现多继承,呵。由于原作者这里没有把代码补全,我就给修补一下,也方便自己理解

function Class10()
{
    this.showSub = function(a,b)
    {
        alert(a-b);
    }
}

function Class11()
{
    this.showAdd = function(a,b)
    {
        alert(a+b);
    }
}


function Class2()
{
    Class10.call(this);
    Class11.call(this);
}

var c2 = new Class2();

c2.showAdd(1,2);

c2.showSub(2,1);

两个call()方法就实现了多重继承。呵。

apply()方法与call()方法完全一样,只是apply()方法后面要调用的参数要以数组形式给出即:[0,1]这样。呵。

====华丽的分隔线====

《JavaScript语言精粹》书中对 apply 方法有着更好理解的概括,现摘录如下:

因为 JavaScript 是一门函数式的面向对象编程语言,所以函数可以拥有方法(函数也是对象,当然可以有方法)。

apply 方法让我们构建一个参数数组并用其去调用函数。它也允许我们选择 this 的值。

apply 方法接收两个参数。第一个是将被绑定给 this 的值。第二个就是参数数组。

  1. Thousands of Dollars 六 11th, 2009 @ 03:49 | #1

    Thanks for posting, I’ll definitely be subscribing to your blog.

  2. BobMarche 六 11th, 2009 @ 07:18 | #2

    Thanks for the useful info. It’s so interesting

  3. simaopig 六 11th, 2009 @ 09:48 | #3

    @Thousands of Dollars
    虽然你是做广告的,不过谢谢你了。。

  4. simaopig 六 11th, 2009 @ 09:49 | #4

    @BobMarche
    Thanks you very much,i hope it can help you.^_^

  5. 风也飘泊 六 16th, 2009 @ 10:49 | #5

    有点点绕啊….头昏中..

  6. simaopig 六 16th, 2009 @ 10:52 | #6

    @风也飘泊
    嗯。这个还是很绕的。如果不认真看,并且写代码验证的话很难理解。

  7. 随影 六 26th, 2009 @ 13:19 | #7

    call 就是函数到函数的调用吧!!

  8. simaopig 六 26th, 2009 @ 13:25 | #8

    @随影
    也有可能是对象间的调用啊。嗯。

  9. stri 九 12th, 2009 @ 21:49 | #9

    相关于函数与函数的继承吧! :!:

  10. simaopig 九 14th, 2009 @ 11:23 | #10

    @stri
    感觉就是自己没有的东西,借别人的来用。呵呵。

评论提交中, 请稍候...

留言

可以使用的标签: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>
Trackbacks & Pingbacks ( 0 )
  1. 还没有 trackbacks