在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链式操作如何实现以及为什么要用链式操作
Jan 17 Javascript
基于JavaScript 数据类型之Boolean类型分析介绍
Apr 19 Javascript
JavaScript中Math.SQRT2属性的使用详解
Jun 14 Javascript
JavaScript实现算术平方根算法-代码超简单
Sep 11 Javascript
Bootstrap每天必学之表格
Nov 23 Javascript
你有必要知道的25个JavaScript面试题
Dec 29 Javascript
在 Angular中 使用 Lodash 的方法
Feb 11 Javascript
Vue项目中如何引入icon图标
Mar 28 Javascript
JavaScript 跨域之POST实现方法
May 07 Javascript
vue树形结构获取键值的方法示例
Jun 21 Javascript
还不懂递归?读完这篇文章保证你会懂
Jul 29 Javascript
Vue前后端不同端口的实现方法
Sep 19 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实现MVC开发得最简单的方法――模型
2007/04/10 PHP
php简单分页类实现方法
2015/02/26 PHP
PHP数组与对象之间使用递归实现转换的方法
2015/06/24 PHP
Zend Studio使用技巧两则
2016/04/01 PHP
Yii框架实现记录日志到自定义文件的方法
2017/05/23 PHP
thinkPHP和onethink微信支付插件分享
2019/08/11 PHP
解决Laravel自定义类引入和命名空间的问题
2019/10/15 PHP
Node调试工具JSHint的安装及配置教程
2014/05/27 Javascript
一个奇葩的最短的 IE 版本判断JS脚本
2014/05/28 Javascript
通过jquery 获取URL参数并进行转码
2014/08/18 Javascript
jQuery原生的动画效果
2015/07/10 Javascript
浅谈jquery.fn.extend与jquery.extend区别
2015/07/13 Javascript
javascript实现网页字符定位的方法
2015/07/14 Javascript
jQuery实现表单步骤流程导航代码分享
2015/08/28 Javascript
使用vue.js开发时一些注意事项
2016/04/27 Javascript
Bootstrap学习笔记之css样式设计(2)
2016/06/07 Javascript
JS与HTML结合使用marquee标签实现无缝滚动效果代码
2016/07/05 Javascript
深入理解js generator数据类型
2016/08/16 Javascript
js控制li的隐藏和显示实例代码
2016/10/15 Javascript
layui实现checkbox的目录树tree的例子
2019/09/12 Javascript
python 中random模块的常用方法总结
2017/07/08 Python
PythonWeb项目Django部署在Ubuntu18.04腾讯云主机上
2019/04/01 Python
Python实现线性判别分析(LDA)的MATLAB方式
2019/12/09 Python
后端开发使用pycharm的技巧(推荐)
2020/03/27 Python
Python实现AI换脸功能
2020/04/10 Python
python中有帮助函数吗
2020/06/19 Python
Python dict的常用方法示例代码
2020/06/23 Python
css3绘制天猫logo实现代码
2012/11/06 HTML / CSS
css3制作动态进度条以及附加jQuery百分比数字显示
2012/12/13 HTML / CSS
英国手工制作的现代与经典的沙发和床:Love Your Home
2020/09/26 全球购物
全陪导游欢迎词
2014/01/17 职场文书
九月份红领巾广播稿
2014/01/22 职场文书
小学教师自我剖析材料
2014/09/29 职场文书
贷款收入证明格式
2015/06/24 职场文书
一小时迅速入门Mybatis之bind与多数据源支持 Java API
2021/09/15 Javascript
Win10此设备不支持接收Miracast无法投影的解决方法
2022/07/07 数码科技