javascript中call,apply,callee,caller用法实例分析


Posted in Javascript onJuly 24, 2019

本文实例讲述了javascript中call,apply,callee,caller用法。分享给大家供大家参考,具体如下:

实践一:call,apply 用来让一个对象去调用本不属于自己的方法,两者都可以传递参数,call的参数是列表形式,apply的参数是数组形式

var person = {
 "name":"Tom",
 "say":function(){
 console.log("person say");
 },
 "count":function(x,y,z){
 console.log('x= ' + x + ', y= ' + y + ', z= ' + z);
 },
 "sayName":function(){
 console.log(this.name);
 }
}
// 下面的示例是数组 arr 去调用person的say方法 , 这里call用来让数组调用本不属于它自己的方法
var arr = [1,2];
person.say.call(arr);
// call 还可以传递参数
person.count.call(arr,1,2,3); // x= 1, y= 2, z= 3
// apply 还可以这样
person.count.apply(arr,[1,2,3]); // x= 1, y= 2, z= 3

实践二:call,apply 用来修改this,   同样引用上例的person对象

var program = {"name":"AlphaGo"}
person.sayName.call(program); // AlphaGo
person.sayName.apply(program); // AlphaGo

实践三:call,apply把伪数组转换为数组

// call,apply 把伪数组转换为数组
var wArr = {0:"hello",1:"world","length":2};
var arr1 = Array.prototype.slice.call(wArr);
var arr2 = Array.prototype.slice.apply(wArr);
console.log(arr1); // [hello,world]
console.log(arr2); // [hello,world]

这里找到一篇详细的  关于伪数组的文章

实践四:单纯的arguments对象

// 有关arguments
function count(a,b,c){
 console.log(arguments.length);
 if(count.length === arguments.length) {
 console.log('实际参数与形参个数相同');
 }else{
 console.log('实际参数与形参个数不同');
 }
}
count(1,2,3); // 实际参数与形参个数相同
count(1,2); // 实际参数与形参个数不同
/*
这里count.length 表示形参个数
arguments.length 表示实参个数
*/

实践五:caller 用于查看,函数本身被哪个函数调用

function fn1(){
 if(fn1.caller){
 console.log(fn1.caller.name + " 是函数fn1的调用者");
 }else{
 console.log("直接执行");
 }
}
function fn2(){
 fn1();
};
fn2(); // fn2是是函数fn1的调用者

实践六:callee 返回正被执行的 Function 对象,常用于匿名函数的递归与arguments一起配合使用。

var sum = function(n){
 if(n>0) {
 return n + arguments.callee(n-1);
 }
 return 0;
};
var total = sum(10);
console.log(total); // 55
// arguments.callee 代指函数自身。
function test(){
 console.log(arguments.callee);
}
test(); // 输出函数自身的字符串表达式

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

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

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

Javascript 相关文章推荐
Javascript 调试利器 Firebug使用详解六
Jul 05 Javascript
js multiple全选与取消全选实现代码
Dec 04 Javascript
用js通过url传参把数据从一个页面传到另一个页面
Sep 01 Javascript
javascript中return,return true,return false三者的用法及区别
Nov 17 Javascript
JavaScript的设计模式经典之建造者模式
Feb 24 Javascript
JQuery中attr属性和jQuery.data()学习笔记【必看】
May 18 Javascript
js 中获取制定的cook信息实现方法
Nov 19 Javascript
浅谈Vue.js中ref ($refs)用法举例总结
Dec 19 Javascript
对Angular中单向数据流的深入理解
Mar 31 Javascript
webpack分离css单独打包的方法
Jun 12 Javascript
vue项目打包后打开页面空白解决办法
Jun 29 Javascript
如何基于viewport vm适配移动端页面
Nov 13 Javascript
javascript关于“时间”的一次探索
Jul 24 #Javascript
javascript面向对象三大特征之封装实例详解
Jul 24 #Javascript
解决vue-cli webpack打包开启Gzip 报错问题
Jul 24 #Javascript
Vue  webpack 项目自动打包压缩成zip文件的方法
Jul 24 #Javascript
JavaScript面向对象中接口实现方法详解
Jul 24 #Javascript
IE11下处理Promise及Vue的单项数据流问题
Jul 24 #Javascript
微信小程序如何引用外部js,外部样式,公共页面模板
Jul 23 #Javascript
You might like
MySql中正则表达式的使用方法描述
2008/07/30 PHP
PHPCMS的使用小结
2010/09/20 PHP
Windows下利用Gvim写PHP产生中文乱码问题解决方法
2011/04/20 PHP
php计算数组相同值出现次数的代码(array_count_values)
2015/01/20 PHP
PHP实现一维数组转二维数组的方法
2015/02/25 PHP
PHP版微信公众平台红包API
2015/04/02 PHP
php中array_unshift()修改数组key注意事项分析
2016/05/16 PHP
PHP创建文件及写入数据(覆盖写入,追加写入)的方法详解
2019/02/15 PHP
laravel5.6 框架邮件队列database驱动简单demo示例
2020/01/26 PHP
jquery选择器、属性设置用法经验总结
2013/09/08 Javascript
JavaScript调用ajax获取文本文件内容实现代码
2014/03/28 Javascript
jquery实现点击展开列表同时隐藏其他列表
2015/08/10 Javascript
原生js代码实现图片放大境效果
2016/10/30 Javascript
jQuery动态移除和添加背景图片的方法详解
2017/03/07 Javascript
正则 js分转元带千分符号详解
2017/03/08 Javascript
值得分享和收藏的xmlplus组件学习教程
2017/05/05 Javascript
webpack打包单页面如何引用的js
2017/06/07 Javascript
JS实现页面打印(整体、局部)
2017/08/18 Javascript
Angularjs使用过滤器完成排序功能
2017/09/20 Javascript
jQuery实现模糊查询的方法分析
2018/05/10 jQuery
微信小程序登录session的使用
2019/03/17 Javascript
vue使用Proxy实现双向绑定的方法示例
2019/03/20 Javascript
解决ant design vue中树形控件defaultExpandAll设置无效的问题
2020/10/26 Javascript
[04:02]2014DOTA2国际邀请赛 BBC每日综述中国战队将再度登顶
2014/07/21 DOTA
详解python使用turtle库来画一朵花
2019/03/21 Python
使用Python调取任意数字资产钱包余额功能
2019/08/15 Python
python 项目目录结构设置
2020/02/14 Python
Python bytes string相互转换过程解析
2020/03/05 Python
Python判断三段线能否构成三角形的代码
2020/04/12 Python
详解查看Python解释器路径的两种方式
2020/10/15 Python
Linux机考试题
2015/10/16 面试题
医学护理系毕业生求职信
2013/10/01 职场文书
民主评议党员自我评价材料
2014/09/18 职场文书
情人节活动总结范文
2015/02/05 职场文书
家长高考寄语
2015/02/27 职场文书
python基础之停用词过滤详解
2021/04/21 Python