`
usejava
  • 浏览: 71452 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

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

阅读更多

 

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 的值。第二个就是参数数组。

分享到:
评论

相关推荐

    【JavaScript源代码】JavaScript函数之call、apply以及bind方法案例详解.docx

    JavaScript函数之call、apply以及bind方法案例详解  总结 1、相同点 2、区别 call() 方法 /* 正常模式 */ let obj = { sum(a, b) { console.log(this) return a + b } } // 执行 sum 函数的 apply、bind...

    JavaScript函数Call、Apply原理实例解析

    这篇文章主要介绍了JavaScript函数Call、Apply原理实例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 一、方法重用 使用 call() 方法,您可以编写能够在...

    JavaScript中的apply和call函数详解_.docx

    JavaScript中的apply和call函数详解_.docx

    Javascript中call和apply函数的比较和使用实例

    一些简单的Javascript操作中较少会用到call和apply函数,在另外一些较大型的操作中,如web应用开发,js框架开发中可能会经常遇到这两个函数。关于这两个函数的解释,网上的资料也很多,但是本人认为很多资料要么...

    javascript中call和apply方法浅谈

    我们可以将call和apply看做是某个对象的方法,通过调用方法的形式来间接调用函数

    JavaScript中call和apply方法的区别实例分析

    本文实例分析了JavaScript中call和apply方法的区别。分享给大家供大家参考,具体如下: 这两个方法不经常用,但是在某些特殊场合中是非常有用的,下面主要说下它们的区别: 1、首先,JavaScript是一门面向对象的语言...

    JS中的call、apply、bind方法详解.pdf

    在JavaScript中,call、apply、bind三个方法都是函数对象的方法,它们的作用都是改变函数的调用对象。下面,我们将详细介绍这些方法的定义、语法、使用场景和区别。 一、call方法 call方法的语法是:call([thisObj...

    从JQuery源码分析JavaScript函数的apply方法与call方法

    主要介绍了从JQuery源码分析JavaScript函数的apply方法与call方法,本文结合JQuery源码和js高级程序设计再次探究apply方法与call方法,需要的朋友可以参考下

    Javascript 中的 call 和 apply使用介绍

    简单的说就是改变函数执行的上下文,... 这两个方法通常被用来类的继承和回调函数: 作用一、类的继承: 先来看这个例子: 代码如下: function Person(name,age){ this.name = name; this.age=age; this.alertName = f

    【JavaScript源代码】JavaScript函数this指向问题详解.docx

     目录 一、 函数内 this 的指向1、普通函数2、构造函数3、对象方法4、事件绑定方法5、定时器函数6、立即执行函数二、改变函数内部 this 指向1、call 方法2、apply 方法3、bind 方法三、call apply bind 总结1、...

    详解JavaScript函数callee、call、apply的区别

    主要介绍了JavaScript函数callee、call、apply的区别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    JS中的call()和apply()方法的详解

    在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,一般来说,this总是指向调用某个方法的对象,但是使用call()和apply()方法时,就会改变this的指向 语法: apply() 接收两...

    javascript中call,apply,bind函数用法示例

    主要介绍了javascript中call,apply,bind函数用法,结合实例形式分析了call,apply,bind函数的功能、使用方法与相关注意事项,需要的朋友可以参考下

    Javascript中call,apply,bind方法的详解与总结

    以下内容会分为如下小节: ...6.call,apply,bind方法的联系和区别 1.call/apply/bind方法的来源 首先,在使用call,apply,bind方法时,我们有必要知道这三个方法究竟是来自哪里?为什么可以使用的到这三个方法?

    javascript基于原型链的继承及call和apply函数用法分析

    主要介绍了javascript基于原型链的继承及call和apply函数用法,结合实例形式较为详细的分析了javascript中继承的概念、创建方法以及call和apply函数的功能与使用技巧,需要的朋友可以参考下

    JavaScript中函数(Function)的apply与call理解

    主要介绍了JavaScript中函数(Function)的apply与call理解,本文讲解了JavaScript函数调用分为4中模式以及通过apply和call实现扩展和继承两方面,需要的朋友可以参考下

    JavaScript函数apply()和call()用法与异同分析

    本文实例分析了JavaScript函数apply()和call()用法与异同。分享给大家供大家参考,具体如下: JavaScript的函数是对象,因此有属性和方法。每个函数都包含两个属性:length和prototype,每个函数都包含两个非继承而...

Global site tag (gtag.js) - Google Analytics