有关JavaScript中call()和apply() 的一些理解


Posted in Javascript onMay 20, 2016

call()方法和apply()方法,在上层应用中用的不是很多,但在底层写JS框架的时候却常常看到。然后度娘谷哥一番,也发现好多达人写出了自己的理解和笔记,但始终还是云里雾里,于是去W3C学习了下

在W3C网上研究这两个方法的时候,看到一个词语,叫“对象冒充”,这个概念本人觉得还是挺重要的,让我对这两个方法理解起来更加直观。

call()方法,看下官方给出的例子

function sayColor(sPrefix,sSuffix) {
  alert(sPrefix + this.color + sSuffix);
};

var obj = new Object();
obj.color = "blue";

sayColor.call(obj, "The color is ", "a very nice color indeed.");

最后输出的结果是“The color is blue, a very nice color indeed.”

call()方法就是将第一个参数替换方法中的this,然后后面的参数传入该方法使用

apply()方法,同样先看个官方给出的例子

function sayColor(sPrefix,sSuffix) {
  alert(sPrefix + this.color + sSuffix);
};

var obj = new Object();
obj.color = "blue";

sayColor.apply(obj, new Array("The color is ", "a very nice color indeed."));

最后输出的结果仍然是“The color is blue, a very nice color indeed.”

其实call()方法和apply()方法可以粗略的认为是差不多的,第一个参数都是替换方法中this关键字,只是后面传给方法的传参方式不同,call是直接对应,apply是利用数组,在数组中一一对应

以上这篇有关JavaScript中call()和apply() 的一些理解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
使javascript也能包含文件
Oct 26 Javascript
JavaScript 继承详解(一)
Jul 13 Javascript
javascript中的prototype属性使用说明(函数功能扩展)
Aug 16 Javascript
JavaScript中字符串拼接的基本方法
Jul 07 Javascript
学习JavaScript设计模式(策略模式)
Nov 26 Javascript
使用vue.js制作分页组件
Jun 27 Javascript
js判断数组是否包含某个字符串变量的实例
Nov 24 Javascript
js传递数组参数到后台controller的方法
Mar 29 Javascript
对vux点击事件的优化详解
Aug 28 Javascript
微信小程序表单验证WxValidate的使用
Nov 27 Javascript
Vue-router中hash模式与history模式的区别详解
Dec 15 Vue.js
如何优化vue打包文件过大
Apr 13 Vue.js
Bootstrap表格和栅格分页实例详解
May 20 #Javascript
JavaScript 数组some()和filter()的用法及区别
May 20 #Javascript
JS数组操作(数组增加、删除、翻转、转字符串、取索引、截取(切片)slice、剪接splice、数组合并)
May 20 #Javascript
AngularJS中的指令全面解析(必看)
May 20 #Javascript
浅析angularJS中的ui-router和ng-grid模块
May 20 #Javascript
javascript的理解及经典案例分析
May 20 #Javascript
JS中对象与字符串的互相转换详解
May 20 #Javascript
You might like
神族 Protoss 剧情介绍
2020/03/14 星际争霸
WordPress中is_singular()函数简介
2015/02/05 PHP
详解PHP对数组的定义以及数组的创建方法
2015/11/27 PHP
详解php中空字符串和0之间的关系
2016/10/23 PHP
详解PHP发送邮件知识点
2018/05/06 PHP
通过PHP的Wrapper无缝迁移原有项目到新服务的实现方法
2020/04/02 PHP
浅析PHP中json_encode与json_decode的区别
2020/07/15 PHP
JS判断页面加载状态以及添加遮罩和缓冲动画的代码
2012/10/11 Javascript
js中的referrer返回上一页使用介绍
2013/09/26 Javascript
解析offsetHeight,clientHeight,scrollHeight之间的区别
2013/11/20 Javascript
AngularJS中$interval的用法详解
2016/02/02 Javascript
AngularJS中$http服务常用的应用及参数
2016/08/22 Javascript
javascript实现简单的on事件绑定
2016/08/23 Javascript
浅谈js对象属性 通过点(.) 和方括号([]) 的不同之处
2016/10/29 Javascript
angular中实现控制器之间传递参数的方式
2017/04/24 Javascript
微信小程序上传图片到服务器实例代码
2017/11/07 Javascript
JavaScript中Object值合并方法详解
2017/12/22 Javascript
Javascript网页抢红包外挂实现分享
2018/01/11 Javascript
Vue Router的懒加载路径的解决方法
2018/06/21 Javascript
解决element-ui的下拉框有值却无法选中的情况
2020/11/07 Javascript
go和python调用其它程序并得到程序输出
2014/02/10 Python
使用Python编写Linux系统守护进程实例
2015/02/03 Python
Python中的filter()函数的用法
2015/04/27 Python
Python更新数据库脚本两种方法及对比介绍
2017/07/27 Python
python之消除前缀重命名的方法
2018/10/21 Python
python利用faker库批量生成测试数据
2020/10/15 Python
删除pycharm鼠标右键快捷键打开项目的操作
2021/01/16 Python
欧洲领先的电子和电信零售商和服务提供商:Currys PC World Business
2017/12/05 全球购物
华为慧通面试题
2012/09/11 面试题
介绍一下木马病毒的种类
2015/07/26 面试题
Java面试题:请说出如下代码的输出结果
2013/04/22 面试题
岗位职责的含义
2013/11/17 职场文书
土木建筑学生自我评价
2014/01/14 职场文书
新闻稿怎么写
2015/07/18 职场文书
餐厅如何利用“营销策略”扭转亏本局面
2019/10/15 职场文书
Java实现HTML转为Word的示例代码
2022/06/28 Java/Android