实例分析javascript中的call()和apply()方法


Posted in Javascript onNovember 28, 2014

1、方法定义

call方法:
语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]])
定义:调用一个对象的一个方法,以另一个对象替换当前对象。
说明:
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。

apply方法:
语法:apply([thisObj[,argArray]])
定义:应用某一对象的一个方法,用另一个对象替换当前对象。
说明:
如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。

2、常用实例

a、

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 对象的引用。

b、

function Animal(){  

    this.name = "Animal";  

    this.showName = function(){  

        alert(this.name);  

    }  

}  

function Cat(){  

    this.name = "Cat";  

}  

var animal = new Animal();  

var cat = new Cat();  

//通过call或apply方法,将原本属于Animal对象的showName()方法交给对象cat来使用了。  

//输入结果为"Cat"  

animal.showName.call(cat,",");  

//animal.showName.apply(cat,[]);

 call 的意思是把 animal 的方法放到cat上执行,原来cat是没有showName() 方法,现在是把animal 的showName()方法放到 cat上来执行,所以this.name 应该是 Cat

c、实现继承

 function Animal(name){    

     this.name = name;    

     this.showName = function(){    

         alert(this.name);    

     }    

 }    

 function Cat(name){  

     Animal.call(this, name);  

 }    

 var cat = new Cat("Black Cat");   

 cat.showName();

Animal.call(this) 的意思就是使用 Animal对象代替this对象,那么 Cat中不就有Animal的所有属性和方法了吗,Cat对象就能够直接调用Animal的方法以及属性了.

d、多重继承

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);

}

很简单,使用两个 call 就实现多重继承了
当然,js的继承还有其他方法,例如使用原型链,这个不属于本文的范畴,只是在此说明call 的用法。说了call ,当然还有 apply,这两个方法基本上是一个意思,区别在于 call 的第二个参数可以是任意类型,而apply的第二个参数必须是数组,也可以是arguments
还有 callee,caller..

总结:

简单的说:相同点:两个方法产生的作用是完全一样的

不同点:方法传递的参数不同

Javascript 相关文章推荐
脚本收藏iframe
Jul 21 Javascript
Add a Picture to a Microsoft Word Document
Jun 15 Javascript
js实现运行代码需要刷新的解决方法
Aug 18 Javascript
Javascript 匿名函数及其代码模式原理
Mar 19 Javascript
jquery+ajax实现直接提交表单实例分析
Jun 17 Javascript
BootStrap 动态添加验证项和取消验证项的实现方法
Sep 28 Javascript
vue.js从安装到搭建过程详解
Mar 17 Javascript
jQuery 循环遍历改变a标签的href(实例讲解)
Jul 12 jQuery
vuex中使用对象展开运算符的示例
Sep 25 Javascript
前端MVVM框架解析之双向绑定
Jan 24 Javascript
在Vue项目中引入JQuery-ui插件的讲解
Jan 27 jQuery
Vue项目前后端联调(使用proxyTable实现跨域方式)
Jul 18 Javascript
深入理解javascript严格模式(Strict Mode)
Nov 28 #Javascript
jquery+php实现搜索框自动提示
Nov 28 #Javascript
Javascript前端UI框架Kit使用指南之kitjs事件管理
Nov 28 #Javascript
Javascript前端UI框架Kit使用指南之kitjs的对话框组件
Nov 28 #Javascript
Javascript前端UI框架Kit使用指南之Kitjs简介
Nov 28 #Javascript
非jQuery实现照片散落桌子上,单击放大的LightBox效果
Nov 28 #Javascript
开源的javascript项目Kissy介绍
Nov 28 #Javascript
You might like
优化使用mysql存储session的php代码
2008/01/10 PHP
php通用防注入程序 推荐
2011/02/26 PHP
CI框架学习笔记(一) - 环境安装、基本术语和框架流程
2014/10/26 PHP
PHP中的Streams详细介绍
2014/11/12 PHP
PHP中快速生成随机密码的几种方式
2017/04/17 PHP
详解PHP防止盗链防止迅雷下载的方法
2017/04/26 PHP
PHP数组内存利用率低和弱类型详细解读
2017/08/10 PHP
PHP利用百度ai实现文本和图片审核
2019/05/08 PHP
用javascript动态调整iframe高度的代码
2007/04/10 Javascript
javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox
2008/08/05 Javascript
jquery maxlength使用说明
2011/09/09 Javascript
JavaScript不刷新实现浏览器的前进后退功能
2014/11/05 Javascript
JavaScript对象反射用法实例
2015/04/17 Javascript
AngularJS的一些基本样式初窥
2015/07/27 Javascript
SpringMVC框架下JQuery传递并解析Json格式的数据是如何实现的
2015/12/10 Javascript
理解JavaScript表单的基础知识
2016/01/25 Javascript
AngularJS 限定$scope的范围实例详解
2017/06/23 Javascript
js轮播图的插件化封装详解
2017/07/17 Javascript
[02:12]打造更好的电竞完美世界:完美盛典回顾篇
2018/12/19 DOTA
Python查询Mysql时返回字典结构的代码
2012/06/18 Python
讲解python参数和作用域的使用
2013/11/01 Python
Python 实现购物商城,含有用户入口和商家入口的示例
2017/09/15 Python
python os.path模块常用方法实例详解
2018/09/16 Python
Python重新加载模块的实现方法
2018/10/16 Python
Django Admin中增加导出CSV功能过程解析
2019/09/04 Python
python numpy库linspace相同间隔采样的实现
2020/02/25 Python
Python数据可视化实现多种图例代码详解
2020/07/14 Python
Python 创建TCP服务器的方法
2020/07/28 Python
python 基于opencv去除图片阴影
2021/01/26 Python
HTML5 创建canvas元素示例代码
2014/06/04 HTML / CSS
带你认识HTML5中的WebSocket
2015/05/22 HTML / CSS
会计与审计毕业生自荐信范文
2013/12/30 职场文书
物流仓储计划书
2014/01/10 职场文书
董事长助理工作职责
2014/06/08 职场文书
个人贷款收入证明
2014/10/26 职场文书
小学一年级班主任工作经验交流材料
2015/11/02 职场文书