JavaScript 学习笔记(九)call和apply方法


Posted in Javascript onJanuary 11, 2010

call和apply方法
call方法可改变上下文this指针,类似的方法还有apply,主要用在js对象各方法互相调用的时候,使当前this实例指针保持一致,或在特殊情况下需要改变this指针。
obj1.method1.call(obj2,argument1,argument2)
如上,call的作用就是把obj1的方法放到obj2上使用,后面的argument1…这些做为参数传入。
举一个具体的例子

function add(a, b) { 
alert(a + b); 
} 
function sub(a, b) { 
alert(a - b); 
} 
add.call(sub, 3, 1);

这个例子中的意思就是用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4); // 注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。
看一个稍微复杂一点的例子
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");
另外可以用 call 来实现继承
function Class1() { 
this.showTxt = function(txt) { 
alert(txt); 
} 
} function Class2() { 
Class1.call(this); 
} 
var c2 = new Class2(); 
c2.showTxt("cc");

这样 Class2 就继承Class1了,Class1.call(this) 的 意思就是使用 Class1 对象代替this对象,那么 Class2 中不就有Class1 的所有属性和方法了吗,c2 对象就能够直接调用Class1 的方法以及属性了,执行结果就是:alert(“cc”);
这就是 javaScript 如何来模拟面向对象中的继承的,还可以实现多重继承。
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); 
}

1.call方法
调用一个对象的一个方法,以另一个对象替换当前对象。
call([thisObj[,arg1[, arg2[, [,.argN]]]]])
参数
thisObj 可选项。将被用作当前对象的对象。
arg1, arg2, , argN 可选项。将被传递方法参数序列。
2.apply方法
应用某一对象的一个方法,用另一个对象替换当前对象。
apply([thisObj[,argArray]])
参数
thisObj 可选项。将被用作当前对象的对象。
argArray 可选项。将被传递给该函数的参数数组。

两者的区别
两者实现的功能是完全一样的,只是参数传递方式不一样,call是将各个参数以逗号(,)隔开,而apply是将所有参数组成一个数组进行传递。

Javascript 相关文章推荐
分享XmlHttpRequest调用Webservice的一点心得
Jul 20 Javascript
关于div自适应高度/左右高度自适应一致的js代码
Mar 22 Javascript
node.js应用后台守护进程管理器Forever安装和使用实例
Jun 01 Javascript
了不起的node.js读书笔记之node.js中的特性
Dec 22 Javascript
JQuery球队选择实例
May 18 Javascript
javascript中undefined与null的区别
Aug 16 Javascript
基于javascript实现图片滑动效果
May 07 Javascript
AngularJS 工作原理详解
Aug 18 Javascript
vue注册组件的几种方式总结
Mar 08 Javascript
浅谈Node.js 沙箱环境
May 15 Javascript
Vue.directive使用注意(小结)
Aug 31 Javascript
微信小程序 接入腾讯地图的两种写法
Jan 12 Javascript
取选中的radio的值
Jan 11 #Javascript
javascript Object与Function使用
Jan 11 #Javascript
Extjs学习笔记之九 数据模型(上)
Jan 11 #Javascript
JavaScript 事件冒泡简介及应用
Jan 11 #Javascript
Javascript 读书笔记索引贴
Jan 11 #Javascript
Javascript学习笔记9 prototype封装继承
Jan 11 #Javascript
Javascript学习笔记8 用JSON做原型
Jan 11 #Javascript
You might like
php使用smtp发送支持附件的邮件示例
2014/04/13 PHP
ThinkPHP分页实例
2014/10/15 PHP
php中fgetcsv()函数用法实例
2014/11/28 PHP
详解WordPress中添加和执行动作的函数使用方法
2015/12/29 PHP
PHP实现非阻塞模式的方法分析
2018/07/26 PHP
PHP PDOStatement::fetch讲解
2019/01/31 PHP
JS BASE64编码 window.atob(), window.btoa()
2021/03/09 Javascript
利用ASP发送和接收XML数据的处理方法与代码
2007/11/13 Javascript
JQuery 操作Javascript对象和数组的工具函数小结
2010/01/22 Javascript
javascript函数以及基础写法100多条实用整理
2013/01/13 Javascript
JavaScript 数组详解
2013/10/10 Javascript
js中cookie的添加、取值、删除示例代码
2013/10/21 Javascript
JS实现超简洁网页title标题跑动闪烁提示效果代码
2015/10/23 Javascript
js实现获取鼠标当前的位置
2016/12/14 Javascript
原生javascript移动端滑动banner效果
2017/03/10 Javascript
vuejs2.0子组件改变父组件的数据实例
2017/05/10 Javascript
vue-next/runtime-core 源码阅读指南详解
2019/10/25 Javascript
JavaScript日期库date-fn.js使用方法解析
2020/09/09 Javascript
Vue如何实现变量表达式选择器
2021/02/18 Vue.js
Python多线程学习资料
2012/12/19 Python
在Python下利用OpenCV来旋转图像的教程
2015/04/16 Python
Python字典简介以及用法详解
2016/11/15 Python
Python 正则表达式入门(中级篇)
2016/12/07 Python
Python中遇到的小问题及解决方法汇总
2017/01/11 Python
Python中输入和输出(打印)数据实例方法
2019/10/13 Python
python 6.7 编写printTable()函数表格打印(完整代码)
2020/03/25 Python
python tkinter实现下载进度条及抖音视频去水印原理
2021/02/07 Python
CSS3实现千变万化的文字阴影text-shadow效果设计
2016/04/26 HTML / CSS
Spartoo英国:欧洲最大的网上鞋店
2016/09/13 全球购物
澳大利亚家具商店:Freedom
2020/12/17 全球购物
大学同学十年聚会感言
2014/02/21 职场文书
宪法宣传周工作方案
2014/05/26 职场文书
五年级小学生评语
2014/12/26 职场文书
升学宴学生答谢词
2015/01/05 职场文书
家属答谢词
2015/01/05 职场文书
乒乓球比赛通知
2015/04/27 职场文书