在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 相关文章推荐
20个非常有用的PHP类库 加速php开发
Jan 15 Javascript
JavaScript随机排序(随即出牌)
Sep 17 Javascript
JS禁用浏览器退格键实现思路及代码
Oct 29 Javascript
Jquery之Bind方法参数传递与接收的三种方法
Jun 24 Javascript
javaScript事件机制兼容【详细整理】
Jul 23 Javascript
AngularJS实现根据变量改变动态加载模板的方法
Nov 04 Javascript
基于iscroll.js实现下拉刷新和上拉加载效果
Nov 28 Javascript
vue-cli如何快速构建vue项目
Apr 26 Javascript
详解angularJs模块ui-router之状态嵌套和视图嵌套
Apr 28 Javascript
vue中如何实现变量和字符串拼接
Jun 19 Javascript
Vue实现PC端靠边悬浮球的代码
May 09 Javascript
微信小程序入门之绘制时钟
Oct 22 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转成EXE文件
2006/10/09 PHP
我的论坛源代码(四)
2006/10/09 PHP
php getimagesize 上传图片的长度和宽度检测代码
2010/05/15 PHP
PHP重定向的3种方式
2013/03/07 PHP
基于递归实现的php树形菜单代码
2014/11/19 PHP
又十个超级有用的PHP代码片段
2015/09/24 PHP
PHP迭代器和生成器用法实例分析
2019/09/28 PHP
php array 转json及java 转换 json数据格式操作示例
2019/11/13 PHP
javascript实现动态CSS换肤技术的脚本
2007/06/29 Javascript
jquery.fileEveryWhere.js 一个跨浏览器的file显示插件
2011/10/24 Javascript
jquery实现商品拖动选择效果代码(自写)
2013/05/28 Javascript
jquery iframe操作详细解析
2013/11/20 Javascript
JavaScript获取鼠标移动时的坐标(兼容IE8、chome谷歌、Firefox)
2014/09/13 Javascript
innerHTML属性,outerHTML属性,textContent属性,innerText属性区别详解
2015/03/13 Javascript
JavaScript函数使用的基本教程
2015/06/04 Javascript
详解JavaScript函数对象
2015/11/15 Javascript
jQuery实现的鼠标经过时变宽的效果(附demo源码)
2016/04/28 Javascript
JS使用单链表统计英语单词出现次数
2016/06/16 Javascript
jQuery内容过滤选择器用法示例
2016/09/09 Javascript
微信小程序开发图片拖拽实例详解
2017/05/05 Javascript
js中位运算的运用实例分析
2018/12/11 Javascript
layer ui插件显示tips时,修改字体颜色的实现方法
2019/09/11 Javascript
2分钟实现一个Vue实时直播系统的示例代码
2020/06/05 Javascript
Python中Collection的使用小技巧
2014/08/18 Python
Python DataFrame设置/更改列表字段/元素类型的方法
2018/06/09 Python
快速解决vue.js 模板和jinja 模板冲突的问题
2019/07/26 Python
Web页面中八种创建多列等高(等高列布局)的实现技术
2012/12/24 HTML / CSS
加拿大租车网站:Enterprise Rent-A-Car
2018/07/26 全球购物
西班牙香水和化妆品购物网站:Arenal Perfumerías
2019/03/01 全球购物
波兰快递服务:Globkurier.pl
2019/11/08 全球购物
局部内部类是否可以访问非final变量?
2013/04/20 面试题
党员应该树立反腐倡廉的坚定意识思想汇报
2014/09/12 职场文书
2014年乡镇工会工作总结
2014/12/02 职场文书
幼儿园辞职信范文
2015/02/27 职场文书
Python pandas求方差和标准差的方法实例
2021/08/04 Python
SQL SERVER实现连接与合并查询
2022/02/24 SQL Server