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 获取图片颜色
Apr 05 Javascript
jQuery AJAX 调用WebService实现代码
Mar 24 Javascript
jquery打开直接跳到网页最下面、最低端实现代码
Apr 22 Javascript
javascript中的parseInt和parseFloat区别
Jul 12 Javascript
JavaScript中的类数组对象介绍
Dec 30 Javascript
EXT中单击button按钮grid添加一行(光标位置可设置)的实例代码
Jun 02 Javascript
jQuery动态改变多行文本框高度的方法
Sep 07 Javascript
微信小程序自定义组件传值 页面和组件相互传数据操作示例
May 05 Javascript
vue filter 完美时间日期格式的代码
Aug 14 Javascript
vue实现移动端省市区选择
Sep 27 Javascript
js实现旋转的星空效果
Nov 01 Javascript
Vuex实现购物车小功能
Aug 17 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
SONY SRF-M100的电路分析
2021/03/02 无线电
PHP OPP机制和模式简介(抽象类、接口和契约式编程)
2014/06/09 PHP
Linux基于php-fpm模式的lamp搭建phpmyadmin的方法
2018/10/25 PHP
javascript网页关键字高亮代码
2008/07/30 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
2011/05/19 Javascript
非常棒的10款jQuery 幻灯片插件
2011/06/14 Javascript
jquery iframe操作详细解析
2013/11/20 Javascript
JavaScript访问CSS属性的几种方式介绍
2014/07/21 Javascript
js点击选择文本的方法
2015/02/09 Javascript
Node.js开发者必须了解的4个JS要点
2016/02/21 Javascript
D3.js中强制异步文件读取同步的几种方法
2017/02/06 Javascript
JavaScript实现时间表动态效果
2017/07/15 Javascript
layui框架中layer父子页面交互的方法分析
2017/11/15 Javascript
详解小程序缓存插件(mrc)
2018/08/17 Javascript
微信小程序之裁剪图片成圆形的实现代码
2018/10/11 Javascript
微信小程序复选框实现多选一功能过程解析
2020/02/14 Javascript
nuxt+axios实现打包后动态修改请求地址的方法
2020/04/22 Javascript
React生命周期原理与用法踩坑笔记
2020/04/28 Javascript
Python for Informatics 第11章之正则表达式(二)
2016/04/21 Python
Python彩色化Linux的命令行终端界面的代码实例分享
2016/07/02 Python
Django URL传递参数的方法总结
2016/08/28 Python
利用Python代码实现数据可视化的5种方法详解
2018/03/25 Python
解决Python 爬虫URL中存在中文或特殊符号无法请求的问题
2018/05/11 Python
Window环境下Scrapy开发环境搭建
2018/11/18 Python
python+selenium实现自动化百度搜索关键词
2019/06/03 Python
python lambda表达式在sort函数中的使用详解
2019/08/28 Python
Pytorch之view及view_as使用详解
2019/12/31 Python
美国知名保健品网站:LuckyVitamin(支持中文)
2017/08/09 全球购物
Marc Jacobs官方网站:美国奢侈品牌
2017/08/29 全球购物
本科生个人求职自荐信
2013/09/26 职场文书
小学英语教师先进事迹
2014/05/28 职场文书
2014迎接教师节演讲稿
2014/09/10 职场文书
基层党员群众路线教育实践活动个人对照检查材料思想汇报
2014/10/05 职场文书
公司优秀员工推荐信
2015/03/24 职场文书
健身房被搭讪?用python写了个小米计时器助人为乐
2021/06/08 Python
python​格式化字符串
2022/04/20 Python