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 相关文章推荐
关于query Javascript CSS Selector engine
Apr 12 Javascript
jquery必须知道的一些常用特效方法及使用示例(整理)
Jun 24 Javascript
js格式化时间和js格式化时间戳示例
Feb 10 Javascript
AngularJS中的Directive实现延迟加载
Jan 25 Javascript
jquery跟随屏幕滚动效果的实现代码
Apr 13 Javascript
Javascript 普通函数和构造函数的区别
Nov 05 Javascript
Vue.js仿Metronic高级表格(一)静态设计
Apr 17 Javascript
基于vue.js快速搭建图书管理平台
Oct 29 Javascript
JS实现百度搜索接口及链接功能实例代码
Feb 02 Javascript
vue-cli 引入、配置axios的方法
May 08 Javascript
微信小程序按顺序同步执行的两种方式
Dec 20 Javascript
node.JS事件机制与events事件模块的使用方法详解
Feb 06 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 7安装调试工具Xdebug扩展的方法教程
2017/06/17 PHP
PHP编程文件处理类SplFileObject和SplFileInfo用法实例分析
2017/07/22 PHP
thinkphp5框架调用其它控制器方法 实现自定义跳转界面功能示例
2019/07/03 PHP
PHP正则之正向预查与反向预查讲解与实例
2020/04/06 PHP
表单提交验证类
2006/07/14 Javascript
JS中的hasOwnProperty()、propertyIsEnumerable()和isPrototypeOf()
2016/08/11 Javascript
js将table的每个td的内容自动赋值给其title属性的方法
2016/10/13 Javascript
vue2 如何实现div contenteditable=“true”(类似于v-model)的效果
2017/02/08 Javascript
JS中type="button"和type="submit"的区别
2017/07/04 Javascript
原生JavaScript实现Ajax异步请求
2017/11/19 Javascript
vue使用axios时关于this的指向问题详解
2017/12/22 Javascript
JS中移除非数字最多保留一位小数
2018/05/09 Javascript
浅谈微信小程序之官方UI框架we-ui使用教程
2018/08/20 Javascript
JavaScript 复制对象与Object.assign方法无法实现深复制
2018/11/02 Javascript
Vue实现简易翻页效果源码分享
2018/11/08 Javascript
javascript数据类型中的一些小知识点(推荐)
2019/04/18 Javascript
js 执行上下文和作用域的相关总结
2021/02/08 Javascript
python pandas dataframe 行列选择,切片操作方法
2018/04/10 Python
Python GUI Tkinter简单实现个性签名设计
2018/06/19 Python
Python理解递归的方法总结
2019/01/28 Python
python中的协程深入理解
2019/06/10 Python
Python集合基本概念与相关操作实例分析
2019/10/30 Python
numpy实现神经网络反向传播算法的步骤
2019/12/24 Python
基于python检查SSL证书到期情况代码实例
2020/04/04 Python
Python爬虫模拟登陆哔哩哔哩(bilibili)并突破点选验证码功能
2020/12/21 Python
详解Python中的GIL(全局解释器锁)详解及解决GIL的几种方案
2021/01/29 Python
德国、奥地利和瑞士最大的旅行和度假门户网站:HolidayCheck
2019/11/14 全球购物
上海天奕面试题笔试题
2015/04/19 面试题
纪念建党演讲稿范文
2014/01/13 职场文书
如何编写优秀的食品项目创业计划书
2014/01/23 职场文书
青年志愿者活动总结
2014/04/26 职场文书
原料仓仓管员岗位职责
2014/07/08 职场文书
党支部意见范文
2015/06/02 职场文书
会议营销主持词
2015/07/03 职场文书
工作报告范文
2019/06/20 职场文书
未来,这5大方向都很适合创业
2019/07/22 职场文书