基于JavaScript实现继承机制之调用call()与apply()的方法详解


Posted in Javascript onMay 07, 2013

call() 方法

call() 方法是与经典的对象冒充方法最相似的方法。它的第一个参数用作 this 的对象。其他参数都直接传递给函数自身。例如:

function sayHello(sPrefix,sSuffix) {
    alert(this.name + ”says“ + sPrefix + sSuffix);
};
var obj = new Object();
obj.name = "Tom";
sayHello.call(obj, "Hello ", "World.");

在这个例子中,函数 sayHello() 在对象外定义,即使它不属于任何对象,也可以引用关键字 this。对象 obj 的 name属性等于 blue。调用 call() 方法时,第一个参数是 obj,说明应该赋予 sayHello() 函数中的 this 关键字值是 obj。第二个和第三个参数是字符串。它们与 sayHello() 函数中的参数 sPrefix 和 sSuffix 匹配,最后生成的消息 "Tom says Hello World." 将被显示出来。

要与继承机制的对象冒充方法一起使用该方法,只需将前三行的赋值、调用和删除代码替换即可:

function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function () {
        alert(this.color);
    };
}

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(color);
    //delete this.newMethod;
    ClassA.call(this, sColor);
    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

这里,我们需要让 ClassA 中的关键字 this 等于新创建的 ClassB 对象,因此 this 是第一个参数。第二个参数 sColor 对两个类来说都是唯一的参数。

apply() 方法

apply() 方法有两个参数,用作 this 的对象和要传递给函数的参数的数组。例如:

function sayColor(sPrefix,sSuffix) {
    alert(sPrefix + this.color + sSuffix);
};
var obj = new Object();
obj.color = "blue";
sayColor.apply(obj, new Array("The color is ", "a very nice color indeed."));

这个例子与前面的例子相同,只是现在调用的是 apply() 方法。调用 apply() 方法时,第一个参数仍是 obj,说明应该赋予 sayColor() 函数中的 this 关键字值是 obj。第二个参数是由两个字符串构成的数组,与 sayColor() 函数中的参数 sPrefix 和 sSuffix 匹配,最后生成的消息仍是 "The color is blue, a very nice color indeed.",将被显示出来。

该方法也用于替换前三行的赋值、调用和删除新方法的代码:

function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(color);
    //delete this.newMethod;
    ClassA.apply(this, new Array(sColor));
    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

同样的,第一个参数仍是 this,第二个参数是只有一个值 color 的数组。可以把 ClassB 的整个 arguments 对象作为第二个参数传递给 apply() 方法:
function ClassB(sColor, sName) {
    //this.newMethod = ClassA;
    //this.newMethod(color);
    //delete this.newMethod;
    ClassA.apply(this, arguments);
    this.name = sName;
    this.sayName = function () {
        alert(this.name);
    };
}

当然,只有超类中的参数顺序与子类中的参数顺序完全一致时才可以传递参数对象。如果不是,就必须创建一个单独的数组,按照正确的顺序放置参数。此外,还可使用 call() 方法。

我们可以看到这两个方法能够很好的代替原始的对象冒充,使写法上变得稍微简单。但是这些方法的弊端是子类不能继承父类在原型链上声明的方法或属性,针对这个问题下一篇文章将会介绍JavaScript中另一种实现继承的方式—原型链继承。

Javascript 相关文章推荐
用jQuery中的ajax分页实现代码
Sep 20 Javascript
js对象与打印对象分析比较
Apr 23 Javascript
在JavaScript里防止事件函数高频触发和高频调用的方法
Sep 06 Javascript
javascript实现网页子页面遍历回调的方法(涉及 window.frames、递归函数、函数上下文)
Jul 27 Javascript
JavaScript使用键盘输入控制实现数字验证功能
Aug 19 Javascript
Angular中响应式表单的三种更新值方法详析
Aug 22 Javascript
jQuery插件artDialog.js使用与关闭方法示例
Oct 09 jQuery
Node.js中的cluster模块深入解读
Jun 11 Javascript
js+css实现红包雨效果
Jul 12 Javascript
JS与SQL方式随机生成高强度密码示例
Dec 29 Javascript
JSX在render函数中的应用详解
Sep 04 Javascript
vue中根据时间戳判断对应的时间(今天 昨天 前天)
Dec 20 Javascript
JS中的substring和substr函数的区别说明
May 07 #Javascript
js图片自动切换效果处理代码
May 07 #Javascript
JavaScript通过RegExp实现客户端验证处理程序
May 07 #Javascript
JS注册/移除事件处理程序(ExtJS应用程序设计实战)
May 07 #Javascript
使用Math.floor与Math.random取随机整数的方法详解
May 07 #Javascript
基于JavaScript 类的使用详解
May 07 #Javascript
解读JavaScript中 For, While与递归的用法
May 07 #Javascript
You might like
thinkphp获取栏目和文章当前位置的方法
2014/10/29 PHP
PHP curl CURLOPT_RETURNTRANSFER参数的作用使用实例
2015/02/07 PHP
php 实现301重定向跳转实例代码
2016/07/18 PHP
PHP使用mysqli操作MySQL数据库的简单方法
2017/02/04 PHP
Yii2结合Workerman的websocket示例详解
2018/09/10 PHP
实例介绍PHP删除数组中的重复元素
2019/03/03 PHP
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的
2007/04/12 Javascript
document.designMode的功能与使用方法介绍
2007/11/22 Javascript
js自定义方法通过隐藏iframe实现文件下载
2013/02/21 Javascript
js动态给table添加/删除tr的方法
2013/08/02 Javascript
JavaScript数字和字符串转换示例
2014/03/26 Javascript
jQuery实现的漂亮表单效果代码
2015/08/18 Javascript
实例详解angularjs和ajax的结合使用
2015/10/22 Javascript
一个字符串中出现次数最多的字符 统计这个次数【实现代码】
2016/04/29 Javascript
javascript关于继承解析
2016/05/10 Javascript
浅谈JavaScript中数组的增删改查
2016/06/20 Javascript
原生js二级联动效果
2017/06/20 Javascript
小程序跨页面交互的作用与方法详解
2020/01/07 Javascript
Vue路由切换页面不更新问题解决方案
2020/07/10 Javascript
windows下搭建python scrapy爬虫框架步骤
2018/12/23 Python
Pandas统计重复的列里面的值方法
2019/01/30 Python
Python进阶之全面解读高级特性之切片
2019/02/19 Python
Python任意字符串转16, 32, 64进制的方法
2019/06/12 Python
Python二进制文件读取并转换为浮点数详解
2019/06/25 Python
Python 网络编程之UDP发送接收数据功能示例【基于socket套接字】
2019/10/11 Python
Python使用configparser库读取配置文件
2020/02/22 Python
python3处理word文档实例分析
2020/12/01 Python
实习生的自我鉴定范文欣赏
2013/11/20 职场文书
早餐连锁店计划书
2014/01/08 职场文书
电焊工工作岗位职责
2014/02/06 职场文书
五型班组建设方案
2014/02/10 职场文书
2015年工会工作总结
2015/03/30 职场文书
2015年社区纪检工作总结
2015/04/21 职场文书
2015财务年终工作总结范文
2015/05/22 职场文书
《当代神农氏》教学反思
2016/02/23 职场文书
口袋妖怪冰系十大最强精灵,几何雪花排第七,第六类似北极熊
2022/03/18 日漫