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 相关文章推荐
Javascript的一种模块模式
Mar 22 Javascript
document.addEventListener使用介绍
Mar 07 Javascript
jQuery中的jQuery()方法用法分析
Dec 27 Javascript
jQuery进行组件开发完整实例
Dec 15 Javascript
jQuery循环遍历子节点并获取值的方法
Apr 14 Javascript
JS动态给对象添加属性和值的实现方法
Oct 21 Javascript
js实现背景图自适应窗口大小
Jan 10 Javascript
jquery中绑定事件的异同
Feb 28 Javascript
angular十大常见问题
Mar 07 Javascript
TypeScript入门-接口
Mar 30 Javascript
Js实现中国公民身份证号码有效性验证实例代码
May 03 Javascript
自定义vue组件发布到npm的方法
May 09 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
PHP4和PHP5性能测试和对比 测试代码与环境
2007/08/17 PHP
php中存储用户ID和密码到mysql数据库的方法
2013/02/06 PHP
php将12小时制转换成24小时制的方法
2015/03/31 PHP
js cookies 常见网页木马挂马代码 24小时只加载一次
2009/04/13 Javascript
javascript 正则替换 replace(regExp, function)用法
2010/05/22 Javascript
js URL参数的拼接方法比较
2012/02/15 Javascript
用Javascript获取页面元素的具体位置
2013/12/09 Javascript
浏览器中url存储的JavaScript实现
2015/07/07 Javascript
原生js和jQuery实现淡入淡出轮播效果
2015/12/25 Javascript
详解JavaScript树结构
2017/01/09 Javascript
详解JavaScript中js对象与JSON格式字符串的相互转换
2017/02/14 Javascript
JavaScript之DOM插入更新删除_动力节点Java学院整理
2017/07/03 Javascript
使用vs code开发Nodejs程序的使用方法
2017/09/21 NodeJs
原生js+css调节音量滑块
2020/01/15 Javascript
利用H5api实现时钟的绘制(javascript)
2020/09/13 Javascript
JS常用跨域方法实现原理解析
2020/12/09 Javascript
[01:19:11]Ti4 循环赛第二日 NaVi.us vs iG
2014/07/11 DOTA
Python操作json数据的一个简单例子
2014/04/17 Python
Python实现比较两个文件夹中代码变化的方法
2015/07/10 Python
理解Python中的With语句
2016/03/18 Python
Python3中类、模块、错误与异常、文件的简易教程
2017/11/20 Python
TensorFlow打印tensor值的实现方法
2018/07/27 Python
Python爬虫实现爬取百度百科词条功能实例
2019/04/05 Python
Golang GBK转UTF-8的例子
2019/08/26 Python
Python合并2个字典成1个新字典的方法(9种)
2019/12/19 Python
pyinstaller将含有多个py文件的python程序做成exe
2020/04/29 Python
浙大毕业生自荐信
2014/01/26 职场文书
原料仓管员岗位职责
2014/04/12 职场文书
我的梦想演讲稿
2014/04/30 职场文书
信息管理专业自荐书
2014/06/05 职场文书
小学领导班子对照材料
2014/08/23 职场文书
七夕相亲活动策划方案
2014/08/31 职场文书
群众路线教育实践活动心得体会(教师)
2014/10/31 职场文书
2014年大学班长工作总结
2014/11/14 职场文书
《平移和旋转》教学反思
2016/02/19 职场文书
详解如何使用Nginx解决跨域问题
2022/05/06 Servers