在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 相关文章推荐
JS实现在网页中弹出一个输入框的方法
Mar 03 Javascript
js jquery获取当前元素的兄弟级 上一个 下一个元素
Sep 01 Javascript
js实现无缝滚动特效
Dec 20 Javascript
jQuery实现指定区域外单击关闭指定层的方法【经典】
Jun 22 Javascript
浅谈JS运算符&&和|| 及其优先级
Aug 10 Javascript
JS中跨页面调用变量和函数的方法(例如a.js 和 b.js中互相调用)
Nov 01 Javascript
canvas滤镜效果实现代码
Feb 06 Javascript
jQuery中 bind的用法简单介绍
Feb 13 Javascript
jquery在vue脚手架中的使用方式示例
Aug 29 jQuery
Angularjs实现控制器之间通信方式实例总结
Mar 27 Javascript
解决JavaScript layui 下拉框不显示的问题
Aug 14 Javascript
jquery实现商品sku多属性选择功能(商品详情页)
Dec 20 jQuery
很全面的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
PDO防注入原理分析以及使用PDO的注意事项总结
2014/10/23 PHP
ThinkPHP连接数据库的方式汇总
2014/12/05 PHP
php实现utf-8转unicode函数分享
2015/01/06 PHP
php中的动态调用实例分析
2015/01/07 PHP
php微信公众号开发之答题连闯三关
2018/10/20 PHP
javascript学习笔记(七)利用javascript来创建和存储cookie
2011/04/08 Javascript
jqGrid随窗口大小变化自适应大小的示例代码
2013/12/28 Javascript
Firefox中使用outerHTML的2种解决方法
2014/06/07 Javascript
javascript中的__defineGetter__和__defineSetter__介绍
2014/08/15 Javascript
Bootstrap实现响应式导航栏效果
2015/12/28 Javascript
js实现精确到秒的日期选择器完整实例
2016/04/30 Javascript
第六篇Bootstrap表格样式介绍
2016/06/21 Javascript
AngularJS中$watch和$timeout的使用示例
2016/09/20 Javascript
浅谈AngularJs 双向绑定原理(数据绑定机制)
2017/12/07 Javascript
vue-cli webpack模板项目搭建及打包时路径问题的解决方法
2018/02/26 Javascript
Bootstrap Table实现定时刷新数据的方法
2018/08/13 Javascript
vue+element UI实现树形表格带复选框的示例代码
2019/04/16 Javascript
TypeScript高级用法的知识点汇总
2019/12/17 Javascript
[04:29]DOTA2亚洲邀请赛小组赛第一日 TOP10精彩集锦
2015/02/01 DOTA
linux 下实现python多版本安装实践
2014/11/18 Python
Python 序列的方法总结
2016/10/18 Python
python基础_文件操作实现全文或单行替换的方法
2017/09/04 Python
微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧
2018/01/04 Python
pandas修改DataFrame列名的方法
2018/04/08 Python
详解python深浅拷贝区别
2019/06/24 Python
python实现在函数中修改变量值的方法
2019/07/16 Python
python3.7.3版本和django2.2.3版本是否可以兼容
2020/09/01 Python
伦敦最著名的老字号百货公司:Selfridges(塞尔福里奇百货)
2016/07/25 全球购物
英国领先的电动可调床制造商:Laybrook
2019/12/26 全球购物
美国在线肉类和海鲜配送:Crowd Cow
2020/10/02 全球购物
学校后勤人员职责
2013/12/27 职场文书
数学系毕业生的自我评价
2014/01/10 职场文书
小学生新学期寄语
2014/01/19 职场文书
学习雷锋活动总结
2014/04/29 职场文书
2014年文明创建工作总结
2014/11/25 职场文书
与死神共舞观后感
2015/06/15 职场文书