在JavaScript中call()与apply()区别


Posted in Javascript onJanuary 22, 2016

如果没接触过动态语言,以编译型语言的思维方式去理解javaScript将会有种神奇而怪异的感觉,因为意识上往往不可能的事偏偏就发生了,甚至觉得不可理喻.如果在学JavaScript这自由而变幻无穷的语言过程中遇到这种感觉,那么就从现在形始,请放下的您的”偏见”,因为这对您来说绝对是一片新大陆,让JavaScrip

好,言归正传,先理解JavaScrtipt动态变换运行时上下文特性,这种特性主要就体现在apply, call两个方法的运用上.

一、方法的定义

call方法:

语法:call(thisObj,Object)

定义:调用一个对象的一个方法,以另一个对象替换当前对象。

说明:

call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。

apply方法:

语法:apply(thisObj,[argArray])

定义:应用某一对象的一个方法,用另一个对象替换当前对象。

说明:

如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。

如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。

--------------------------------------------------------------------------------

注意:call和apply方法完全一致,只是apply在传参的方式上,它以数组方式来传参。

代码示例:

function Animal(name) {
this.name = name;
this.showName = function() {
console.log(this.name);
};
}
function Cat(name) {
Animal.call(this, name);
}
Cat.prototype = new Animal();
function Dog(name) {
Animal.apply(this, name);
}
Dog.prototype = new Animal();
var cat = new Cat("Black Cat"); //call必须是object
var dog = new Dog(["Black Dog"]); //apply必须是array
cat.showName();
dog.showName();
console.log(cat instanceof Animal);
console.log(dog instanceof Animal);

-------------------------------------------------------------------------------

模拟call, apply的this替换

function Animal(name) {
this.name = name;
this.showName = function() {
alert(this.name);
};
};
function Cat(name) {
this.superClass = Animal;
this.superClass(name);
delete superClass;
}
var cat = new Cat("Black Cat");
cat.showName();

总结:

它们各自的定义:

apply:应用某一对象的一个方法,用另一个对象替换当前对象。

call:调用一个对象的一个方法,以另一个对象替换当前对象。

它们的共同之处:

都“可以用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。”——摘自JScript5.5 .chm

它们的不同之处:

apply:最多只能有两个参数——新this对象和一个数组 argArray。如果给该方法传递多个参数,则把参数都写进这个数组里面,当然,即使只有一个参数,也要写进数组里面。如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。

call:则是直接的参数列表,主要用在js对象各方法互相调用的时候,使当前this实例指针保持一致,或在特殊情况下需要改变this指针。如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。

更简单地说,apply和call功能一样,只是传入的参数列表形式不同:如 func.call(func1,var1,var2,var3)对应的apply写法为:func.apply(func1,[var1,var2,var3])

Javascript 相关文章推荐
jquery实现可拖动DIV自定义保存到数据的实例
Nov 20 Javascript
js调用浏览器打印模块实现点击按钮触发自定义函数
Mar 21 Javascript
IE6-IE9中tbody的innerHTML不能赋值的解决方法
Jun 05 Javascript
点击表单提交时出现jQuery没有权限的解决方法
Jul 23 Javascript
jQuery中offsetParent()方法用法实例
Jan 19 Javascript
Js获取图片原始宽高的实现代码
May 17 Javascript
jQuery实现jQuery-form.js实现异步上传文件
Apr 28 jQuery
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 jQuery
浅谈JavaScript的innerWidth与innerHeight
Oct 12 Javascript
JS中实现一个下载进度条及播放进度条的代码
Jun 10 Javascript
Vuex,iView UI面包屑导航使用扩展详解
Nov 04 Javascript
Vue自定义组件的四种方式示例详解
Feb 28 Javascript
很全面的JavaScript常用功能汇总集合
Jan 22 #Javascript
JavaScript实现仿淘宝商品购买数量的增减效果
Jan 22 #Javascript
jQuery头像裁剪工具jcrop用法实例(附演示与demo源码下载)
Jan 22 #Javascript
JavaScript学习笔记整理之引用类型
Jan 22 #Javascript
jQuery弹层插件jquery.fancybox.js用法实例
Jan 22 #Javascript
基于JS实现新闻列表无缝向上滚动实例代码
Jan 22 #Javascript
jQuery validate插件实现ajax验证重复的2种方法
Jan 22 #Javascript
You might like
php-accelerator网站加速PHP缓冲的方法
2008/07/30 PHP
php 删除一个数组中的某个值.兼容多维数组!
2012/02/18 PHP
php注销代码(session注销)
2012/05/31 PHP
深入PHP内存相关的功能特性详解
2013/06/08 PHP
php缓存技术详细总结
2013/08/07 PHP
php中动态变量用法实例
2015/06/10 PHP
PHP的自定义模板引擎
2017/03/24 PHP
出现“不能执行已释放的Script代码”错误的原因及解决办法
2007/08/29 Javascript
读取input:file的路径并显示本地图片的方法
2013/09/23 Javascript
javascript实现树形菜单的方法
2015/07/17 Javascript
javascript实现tab切换的四种方法
2015/11/05 Javascript
解决jQuery上传插件Uploadify出现Http Error 302错误的方法
2015/12/18 Javascript
AngularJS入门教程之AngularJS指令
2016/04/18 Javascript
BootStrap的JS插件之轮播效果案例详解
2016/05/16 Javascript
BootStrap 动态表单效果
2017/06/02 Javascript
vue.js整合mint-ui里的轮播图实例代码
2017/12/27 Javascript
VueQuillEditor富文本上传图片(非base64)
2020/06/03 Javascript
如何手写一个简易的 Vuex
2020/10/10 Javascript
python 获取et和excel的版本号
2009/04/09 Python
pygame学习笔记(3):运动速率、时间、事件、文字
2015/04/15 Python
Django admin美化插件suit使用示例
2017/12/12 Python
PyQt5每天必学之带有标签的复选框
2018/04/19 Python
使用python读取.text文件特定行的数据方法
2019/01/28 Python
python 中的列表生成式、生成器表达式、模块导入
2019/06/19 Python
python3.x提取中文的正则表达式示例代码
2019/07/23 Python
Python中IP地址处理IPy模块的方法
2019/08/16 Python
python爬虫 基于requests模块发起ajax的get请求实现解析
2019/08/20 Python
简单介绍CSS3中Media Query的使用
2015/07/07 HTML / CSS
HTML5图片预览实例分享
2014/06/04 HTML / CSS
东方电视购物:东方CJ
2016/10/12 全球购物
人事科岗位职责范本
2014/03/02 职场文书
人力资源求职信
2014/05/25 职场文书
个人工作能力自我评价
2015/03/05 职场文书
地道战观后感
2015/06/04 职场文书
python实现web邮箱扫描的示例(附源码)
2021/03/30 Python
Windows Server 修改远程桌面端口的实现
2022/06/25 Servers