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 相关文章推荐
显示js对象所有属性和方法的函数
Oct 16 Javascript
js静态方法与实例方法分析
Jul 04 Javascript
用JQUERY增删元素的代码
Feb 14 Javascript
jQuery图片滚动图片的效果(另类实现)
Jun 02 Javascript
JS中attr和prop属性的区别以及优先选择示例介绍
Jun 30 Javascript
JS密码生成与强度检测完整实例(附demo源码下载)
Apr 06 Javascript
jquery仿ps颜色拾取功能
Mar 08 Javascript
表格展示利器 Bootstrap Table实例代码
Sep 06 Javascript
jQuery插件artDialog.js使用与关闭方法示例
Oct 09 jQuery
vue如何解决循环引用组件报错的问题
Sep 22 Javascript
微信小程序实现文字从右向左无限滚动
Nov 18 Javascript
jquery登录的异步验证操作示例
May 09 jQuery
取选中的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 文章调用类代码
2011/08/11 PHP
php实现在服务器端调整图片大小的方法
2015/06/16 PHP
微信红包随机生成算法php版
2016/07/21 PHP
php获取微信共享收货地址的方法
2017/12/21 PHP
thinkPHP框架实现的短信接口验证码功能示例
2018/06/20 PHP
jQuery 行级解析读取XML文件(附源码)
2009/10/12 Javascript
基于jquery实现图片广告轮换效果代码
2011/07/07 Javascript
JS 各种网页尺寸判断实例方法
2013/04/18 Javascript
JS之获取样式的简单实现方法(推荐)
2016/09/13 Javascript
微信小程序 教程之事件
2016/10/18 Javascript
JS判断键盘是否按的回车键并触发指定按钮点击操作的方法
2017/02/13 Javascript
Bootstrap4如何定制自己的颜色和风格
2018/02/26 Javascript
JS实现将链接生成二维码并转为图片的方法
2018/03/17 Javascript
学习jQuery中的noConflict()用法
2018/09/28 jQuery
JavaScript 性能提升之路(推荐)
2019/04/10 Javascript
ES6的异步终极解决方案分享
2019/07/11 Javascript
vue项目从node8.x升级到12.x后的问题解决
2019/10/25 Javascript
vue flex 布局实现div均分自动换行的示例代码
2020/08/05 Javascript
小程序中手机号识别的示例
2020/12/14 Javascript
Python实现115网盘自动下载的方法
2014/09/30 Python
python求crc32值的方法
2014/10/05 Python
使用Python的PIL模块来进行图片对比
2016/02/18 Python
基于Python中capitalize()与title()的区别详解
2017/12/09 Python
Python2.7环境Flask框架安装简明教程【已测试】
2018/07/13 Python
Python中的函数式编程:不可变的数据结构
2018/10/08 Python
Python微信操控itchat的方法
2019/05/31 Python
Python Web框架之Django框架文件上传功能详解
2019/08/16 Python
python打印异常信息的两种实现方式
2019/12/24 Python
PyQt5 控件字体样式等设置的实现
2020/05/13 Python
AmazeUI 等分网格的实现示例
2020/08/25 HTML / CSS
阿联酋电子产品购物网站:Menakart
2017/09/15 全球购物
会计电算化应届生自荐信
2014/02/25 职场文书
我的梦想演讲稿500字
2014/08/21 职场文书
领导个人查摆剖析材料
2014/10/29 职场文书
远程教育集中轮训基层干部培训班学习心得体会
2016/01/09 职场文书
2016医师资格考试考生诚信考试承诺书
2016/03/25 职场文书