在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弹出层插件简化版代码下载
Oct 16 Javascript
json的定义、标准格式及json字符串检验
May 11 Javascript
基于jQuery实现文本框缩放以及上下移动功能
Nov 24 Javascript
JavaScript实现点击单选按钮改变输入框中文本域内容的方法
Aug 12 Javascript
快速掌握jQuery插件WebUploader文件上传
Nov 07 Javascript
微信小程序request出现400的问题解决办法
May 23 Javascript
微信小程序picker组件简单用法示例【附demo源码下载】
Dec 05 Javascript
vue-router beforeEach跳转路由验证用户登录状态
Dec 26 Javascript
重学 JS:为啥 await 不能用在 forEach 中详解
Apr 15 Javascript
JS算法题之查找数字在数组中的索引位置
May 15 Javascript
vue-router的两种模式的区别
May 30 Javascript
Vue实现返回顶部按钮实例代码
Oct 21 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创建桌面快捷方式的实例代码
2014/02/17 PHP
PHP QRCODE生成彩色二维码的方法
2016/05/19 PHP
javascript getElementsByName()的用法说明
2009/07/31 Javascript
Javascript 读书笔记索引贴
2010/01/11 Javascript
asp.net+jquery滚动滚动条加载数据的下拉控件
2010/06/25 Javascript
HTML5附件拖拽上传drop & google.gears实现代码
2011/04/28 Javascript
js鼠标悬浮出现遮罩层的方法
2015/01/28 Javascript
纯JS实现旋转图片3D展示效果
2015/04/12 Javascript
JavaScript事件 "事件对象"的注意要点
2016/01/14 Javascript
discuz表情的JS提取方法分析
2017/03/22 Javascript
使用Webpack提高Vue.js应用的方式汇总(四种)
2017/07/10 Javascript
angular内置provider之$compileProvider详解
2017/09/27 Javascript
JointJS流程图的绘制方法
2018/12/03 Javascript
[01:33]PWL开团时刻DAY2-开雾与反开雾
2020/10/31 DOTA
简介二分查找算法与相关的Python实现示例
2015/08/26 Python
Python语法分析之字符串格式化
2019/06/13 Python
pyqt5 使用cv2 显示图片,摄像头的实例
2019/06/27 Python
详解python pandas 分组统计的方法
2019/07/30 Python
python matplotlib库直方图绘制详解
2019/08/10 Python
Jupyter notebook 启动闪退问题的解决
2020/04/13 Python
python中的测试框架
2020/11/13 Python
Python 实现PS滤镜的旋涡特效
2020/12/03 Python
python 基于selectors库实现文件上传与下载
2020/12/31 Python
pycharm进入时每次都是insert模式的解决方式
2021/02/05 Python
expedia比利时:预订航班+酒店并省钱
2018/07/13 全球购物
Viking Direct爱尔兰:办公用品和家具
2019/11/21 全球购物
SQL SERVER面试资料
2013/03/30 面试题
5.1手机促销活动
2014/01/17 职场文书
英语教学随笔感言
2014/02/20 职场文书
2014年小学植树节活动方案
2014/03/02 职场文书
跳槽求职信范文
2014/05/26 职场文书
法定代表人授权委托书范文
2014/09/22 职场文书
优秀护士事迹材料
2014/12/25 职场文书
谁动了我的奶酪读书笔记
2015/06/30 职场文书
导游词之山西祁县乔家大院
2019/10/14 职场文书
Java 实现限流器处理Rest接口请求详解流程
2021/11/02 Java/Android