由JavaScript中call()方法引发的对面向对象继承机制call的思考


Posted in Javascript onSeptember 12, 2011

起因:

今天在阅读snandy大神的读jQuery之五(取DOM元素)时,看到有讲到toArray()方法,具体jQuery代码如下:

toArray: function() { 
return slice.call( this, 0 ); 
}, 
get: function( num ) { 
return num == null ? 
// Return a 'clean' array 
this.toArray() : 
// Return just the object 
( num < 0 ? this[ this.length + num ] : this[ num ] ); 
},

看到这里的call()方法,以前也看过手册,说是对象冒充的,用于继承的。在jQuery源码里有点乱,所以就把这部分提取出来,放在一个单独文件中,来看看具体执行。

但还是没太明白,今天决定研究下call。于是查了下MDN上的说明,心血来潮,拿出我的“葵花宝典”-牛津大辞典,准备练习下自己的英文水平,提高提高,而且也提供给有需要的朋友一些帮助(翻译中如果有些出路,请各位前辈见谅!)
call

摘要:

 通过给定的this和arguments来调用一个function

 注意:该方法与apply方法语法相似,但不同的是:call()接受参数列,而apply()接受传递给函数的参数数组

 Function类的一个方法:版本JavaScript 1.3版以后

语法:

 fun.call(thisArg[, arg1[, arg2[, ...]]])

参数说明:

 thisArg:

为fun()的调用指定对象。注意:你看到的this值可能不是实际的值:如果这个方法是在 non-strict mode下,null和undefined会被全局对象替换掉,原始的值会被封装。

 arg1,arg2,....

this对象的参数

描述:

当调用一个已存在的函数,你可以分配不同的对象。这时,this指定的对象是当前正在调用对象。

通过call,你可以只写一次方法,而被另一个对象来继承。而不用自己再新建对象时,重写该方法。(即对象冒充,下面会有例子说明!)

在MDN官网上面有例子可以看看。另外,无意中在stackoverflow上看到了篇相关的问题,看到里面的一个回答,一下子就明白了对象冒充,怎么冒充了。
下面把那部分摘取出来(点击这里看原文):

In javascript, methods of an object can be bound to another object at runtime. In short, javascript allows an object to "borrow" the method of another object:

object1 = { 
name:'frank', 
greet:function(){ 
alert('hello '+this.name) 
} 
}; 
object2 = { 
name:'andy' 
}; 
// Note that object2 has no greet method. 
// But we may "borrow" from object1: 
object1.greet.call(object2);

The call and apply methods of function objects (in javascript functions are objects as well) allows you to do this. So in your code you could say that the Nodelist is borrowing an array's slice method. What does the conversion is the fact that slice returns another array as it's result.

这里的第一句话说的很形象,大致意思就是:在JavaScript中,对象的方法可绑定到另外一个对象上。简单点说,就是,JavaScript中允许对象‘借用'本不属于它本身的方法。“冒充”也就不言而喻了,就上上面的例子来说,object2冒充object1,来调用object1的方法。

PS:菜鸟第一次写博客,有点乱,我相信以后会慢慢改善,向各位师兄师姐学习怎么写博客,写好博客。另外欢迎大家给我批评与指导!

参考资料:
1.w3cschool ECMAScript 继承机制实现

2.MDN上call的说明

3.stackoverflow

Javascript 相关文章推荐
面向对象的javascript(笔记)
Oct 06 Javascript
javascript用函数实现对象的方法
May 14 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
你有必要知道的25个JavaScript面试题
Dec 29 Javascript
JavaScript+CSS实现的可折叠二级菜单实例
Feb 29 Javascript
jquery mobile移动端幻灯片滑动切换效果
Apr 15 Javascript
vuejs响应用户事件(如点击事件)
Mar 14 Javascript
详解Angular 自定义结构指令
Jun 21 Javascript
JS实现的简单下拉框联动功能示例
May 11 Javascript
vue自定v-model实现表单数据双向绑定问题
Sep 03 Javascript
JavaScript实现点击自制菜单效果
Feb 02 Javascript
react中useState使用:如何实现在当前表格直接更改数据
Aug 05 Javascript
腾讯UED 漂亮的提示信息效果代码
Sep 12 #Javascript
jQuery的.live()和.die() 使用介绍
Sep 10 #Javascript
jquery tab插件精简版分享
Sep 10 #Javascript
javascript语言结构小记(一)
Sep 10 #Javascript
JavaScript高级程序设计 客户端存储学习笔记
Sep 10 #Javascript
JavaScript高级程序设计 错误处理与调试学习笔记
Sep 10 #Javascript
JavaScript高级程序设计 事件学习笔记
Sep 10 #Javascript
You might like
PHP获取一个字符串中间一部分字符的方法
2014/08/19 PHP
PHP如何获取当前主机、域名、网址、路径、端口等参数
2017/06/09 PHP
PHP应用跨时区功能的实现方法
2019/03/21 PHP
基本jquery的控制tabs打开的数量的代码
2010/10/17 Javascript
javascript获取ckeditor编辑器的值(实现代码)
2013/11/18 Javascript
easyui datagrid 键盘上下控制选中行示例
2014/03/31 Javascript
学习JavaScript编程语言的8张思维导图分享
2015/03/27 Javascript
无刷新上传文件并返回自定义值
2015/06/11 Javascript
js实现a标签超链接提交form表单的方法
2015/06/24 Javascript
JavaScript基础知识之方法汇总结
2016/01/24 Javascript
浅析JavaScript中命名空间namespace模式
2016/06/22 Javascript
基于JS分页控件实现简单美观仿淘宝分页按钮效果
2016/11/07 Javascript
Jquery on绑定的事件 触发多次实例代码
2016/12/08 Javascript
Radio 单选JS动态添加的选项onchange事件无效的解决方法
2016/12/12 Javascript
微信小程序 label 组件详解及简单实例
2017/01/10 Javascript
JS正则表达式验证账号、手机号、电话和邮箱是否合法
2017/03/08 Javascript
常用的几个JQuery代码片段
2017/03/13 Javascript
JS判断一个数是否是水仙花数
2017/06/11 Javascript
在vue里面设置全局变量或数据的方法
2018/03/09 Javascript
JS/HTML5游戏常用算法之碰撞检测 地图格子算法实例详解
2018/12/12 Javascript
ECharts地图绘制和钻取简易接口详解
2019/07/12 Javascript
JS pushlet XMLAdapter适配器用法案例解析
2020/10/16 Javascript
vue中可编辑树状表格的实现代码
2020/10/31 Javascript
Nodejs + sequelize 实现增删改查操作
2020/11/07 NodeJs
微信小程序实现弹幕墙(祝福墙)
2020/11/18 Javascript
[02:34]肉山说——泡妞篇
2014/09/16 DOTA
python实现上传下载文件功能
2020/11/19 Python
python回调函数中使用多线程的方法
2017/12/25 Python
通过cmd进入python的实例操作
2019/06/26 Python
计算机网络专业个人的自我评价
2013/10/17 职场文书
教师岗位职责范本
2013/12/29 职场文书
特色冷饮店创业计划书
2014/01/28 职场文书
企业口号大全
2014/06/12 职场文书
2019年大学毕业生个人自我鉴定范文大全
2019/03/21 职场文书
Sql-Server数据库单表查询 4.3实验课
2021/04/05 SQL Server
聊聊mysql都有哪几种分区方式
2022/04/13 MySQL