JavaScript中call和apply方法的区别实例分析


Posted in Javascript onAugust 03, 2018

本文实例分析了JavaScript中call和apply方法的区别。分享给大家供大家参考,具体如下:

这两个方法不经常用,但是在某些特殊场合中是非常有用的,下面主要说下它们的区别:

1、首先,JavaScript是一门面向对象的语言,也就是说它有this的概念。而且JavaScript是一门动态类型语言,为什么说它是动态类型语言呢?因为JavaScript在编译时没有类型检查的过程,不会去检查创建的对象类型,也不会去检查传递的参数类型,所以它的变量类型在运行期间是可以改变的。

2、要知道callapply都是为了改变某个函数运行时的上下文(context)而存在的,也就是为了改变函数,也可以说是对象(函数本身就是对象)内部this的指向而存在的。

3、二者区别为:传参数的方式不一样,如下:

func.call(this, arg1, arg2);
func.apply(this, [arg1, arg2]);

上面也很清楚了,call传参数时,明确知道时几个参数或者参数较少时,比如arg1arg2,挨个传就是了;

apply第二个参数必须为一个数组,即将参数放进数组中即可。

4、实例

(function(){
 Array.prototype.push.call(arguments, 4);//arguments借用Array.prototype.push方法
 console.log( arguments ); //输出: [1, 2, 3, 4]
})(1, 2, 3);
var currying = function(fn){
  var args = [];
  return function(){
    if( arguments.length === 0){
      return fn.apply( this, args);
    }
    else{
      [].push.apply( args, arguments);
      return arguments.callee; //callee已弃用
    }
  }
};
var cost = (function(){
 var money = 0;
 return function(0{
   for(var i = 0,l - arguments.length;i<l;i++){
     money += arguments[i];
   }
   return money;
 }
})();

调用:

var cost_ = currying(cost); //将cost转化成curring函数
cost_(1); cost_(2); alert(cost_()); //输出:3

解释:通过currying(柯里化)的转化,在cost_中传入参数时,未能得到值,而是将值存储起来,直到当无参数传入时,输出结果。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
枚举JavaScript对象的函数
Dec 22 Javascript
JS对HTML标签select的获取、添加、删除操作
Oct 17 Javascript
Bootstrap每天必学之模态框(Modal)插件
Apr 26 Javascript
ECMAScript6 新特性范例大全
Mar 24 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
Mar 28 jQuery
js绑定事件和解绑事件
Apr 27 Javascript
基于Vuejs的搜索匹配功能实现方法
Mar 03 Javascript
Vue.js 图标选择组件实践详解
Dec 03 Javascript
使用原生js编写一个简单的框选功能方法
May 13 Javascript
ES6中Symbol、Set和Map用法详解
Aug 20 Javascript
详解在Vue.js编写更好的v-for循环的6种技巧
Apr 14 Javascript
vue实现同时设置多个倒计时
May 20 Vue.js
JavaScript捕捉事件和阻止冒泡事件实例分析
Aug 03 #Javascript
关于js对textarea换行符的处理方法浅析
Aug 03 #Javascript
webpack4 + react 搭建多页面应用示例
Aug 03 #Javascript
使用JS代码实现俄罗斯方块游戏
Aug 03 #Javascript
小程序tab页无法传递参数的方法
Aug 03 #Javascript
详解Webpack多环境代码打包的方法
Aug 03 #Javascript
浅析vue-router jquery和params传参(接收参数)$router $route的区别
Aug 03 #jQuery
You might like
php出现内存位置访问无效错误问题解决方法
2014/08/16 PHP
PHP中使用Session配合Javascript实现文件上传进度条功能
2014/10/15 PHP
php实现两个数组相加的方法
2015/02/17 PHP
2017年最好用的9个php开发工具推荐(超好用)
2017/10/23 PHP
laravel框架路由分组,中间件,命名空间,子域名,路由前缀实例分析
2020/02/18 PHP
JavaScript Archive Network 集合
2007/05/12 Javascript
javascript学习笔记(七) js函数介绍
2012/06/19 Javascript
html组件不可输入(只读)同时任何组件都有效
2013/04/01 Javascript
jquery indexOf使用方法
2013/08/19 Javascript
JavaScript模块随意拖动示例代码
2014/05/27 Javascript
js实现网页标题栏闪烁提示效果实例分析
2014/11/20 Javascript
jquery获取select选中值的方法分析
2015/12/22 Javascript
全面解析Bootstrap中transition、affix的使用方法
2016/05/30 Javascript
浅谈jQuery中的checkbox问题
2016/08/10 Javascript
vue-cli+webpack在生成的项目中使用bootstrap实例代码
2017/05/26 Javascript
浅析webpack 如何优雅的使用tree-shaking(摇树优化)
2017/08/16 Javascript
浅谈Vue-cli 命令行工具分析
2017/11/22 Javascript
JavaScript递归函数定义与用法实例分析
2019/01/24 Javascript
Python函数的参数常见分类与用法实例详解
2019/03/30 Python
用Python实现将一张图片分成9宫格的示例
2019/07/05 Python
python并发编程多进程 模拟抢票实现过程
2019/08/20 Python
python 图像处理画一个正弦函数代码实例
2019/09/10 Python
numpy np.newaxis 的实用分享
2019/11/30 Python
Python2与Python3关于字符串编码处理的差别总结
2020/09/07 Python
Python做图像处理及视频音频文件分离和合成功能
2020/11/24 Python
在PyCharm中安装PaddlePaddle的方法
2021/02/05 Python
HTML5探秘:用requestAnimationFrame优化Web动画
2018/06/03 HTML / CSS
IE9对HTML5中部分属性不支持的原因分析
2014/10/15 HTML / CSS
携程英文网站:Trip.com
2017/02/07 全球购物
财务管理专业毕业生求职信范文
2013/09/21 职场文书
应聘会计求职信
2014/06/11 职场文书
我心目中的好老师活动方案
2014/08/19 职场文书
2016年离婚协议书范文
2016/03/18 职场文书
python实现语音常用度量方法的代码详解
2021/05/25 Python
低门槛开发iOS、Android、小程序应用的前端框架详解
2021/10/16 Javascript
SQLServer RANK() 排名函数的使用
2022/03/23 SQL Server