javascript中caller和callee详解


Posted in Javascript onAugust 10, 2015

最近学习javascript,碰到caller和callee的问题,去网上百度了很多。搜到的内容大同小益,整理总结了一下与大家分享。

caller:返回一个对调用function函数的函数的引用(用法:function.caller)

说明:对于函数来说,caller属性只有在函数执行时才有定义。如果函数由顶层调用,caller则为null。

var time = 3 //控制次数,去掉会一直在caller与handleCaller交替不断执行
function caller() {
  caller.caller()//返回调用caller函数的函数引用
}
function handleCaller() {
  if (time > 0){
    time--
    alert(handleCaller.caller)//返回调用handleCaller函数的函数引用
    alert(caller.caller)//返回调用caller函数的函数引用
    caller()
  }
}
handleCaller()

例子分析:第一次handleCaller运行的时候,两个alert返回的都是null,alert(handleCaller.caller)返回null是因为它是由顶层调用, alert(caller.caller)返回null是因为caller的默认值是null。接下去caller()函数被调用,caller.caller返回的是调用它的函数(handleCaller)的引用,通过caller.caller()可以再次调用handleCaller函数。第二次handleCaller运行的时候,alert(handleCaller.caller)返回的是caller代码(其实就是caller的引用),alert(caller.caller)返回的是handleCaller代码。因为函数之间的调用关系是handleCaller->caller->handleCaller。之后就不断在2个函数之间交替执行。

caller指向调用当前函数的函数,但是有一点,如果是在全局作用域内(即顶层window)被调用,则返回null。
代码走起

====================
function testCaller(){
if(testCaller.caller == null){
console.log('accessed at global');
}else{
console.log('accessed at ' + testCaller.caller);
}
}

在全局调用

testCaller(); // accessed at global

在一个函数中调用

function a(){
testCaller();
}
a(); // accessed at function a(){testCaller();}

此时,testCaller.caller指向就是 function a

callee:返回相对应的arguments的函数引用。(多用于匿名函数递归)

说明:也许你在网上看到最多的是callee返回正在执行的函数引用。我是这么理解,每个函数都有一个自己的arguments,通常是用来存放参数的。arguments有一个callee 属性,初始值就是对应自身的函数引用。当你函数执行到该语句时,arguments是默认对应的是你现在执行的函数,那么arguments.callee为当前正在执行的函数的引用。当然如果你有标记过其他函数的arguments(例子中的args),自然可以用args.callee()去再次调用那个函数。

function a(){
  alert(arguments.callee)
  var args = arguments
  function c(){
    alert(arguments.callee)
    args.callee()
  }
  c()
}
a()

例子分析:例子中的arguments.callee都是默认返回当前正在执行的函数的引用(a中返回a自身函数引用,c中返回c自身函数引用),而通过用args存放a函数的arguments,在内置函数c中使用args.callee()再次调用a函数。

====================
function a(x){

if(x<=1)
return x;
else
return x + a(x-1);
}
a(12) // 78

这是一个极简的递归,运行结果正常。

再看看下面的调用方法

var b = a;
a = null; // 将a回收
b(12); // erro : 'a' is not a function

原因也简单,b=a,b=function a(){};在b调用之前,我们用了a=null。所以在 function a 运行的时候,其中的return x + a(x-1);中的a,指向的就是null,而不是 function a。
所以就报错了,如何解决这样的问题。我们将a换一种写法

function a(x){
if(x<=1)
return x;
else
return arguments.callee(x-1); // 这句是改变的地方
}

再调用

var b = a;
a = null;
b(12); // 78

原因:虽然我们将a=null了,但是函数a中并没有用到a,而是通过arguments.callee指向当前函数。
因为arguments.callee的定义就是:返回正在执行的函数。

Javascript 相关文章推荐
jquery下操作HTML控件的实现代码
Jan 12 Javascript
jQuery代码优化 选择符篇
Nov 01 Javascript
jQuery学习笔记 操作jQuery对象 文档处理
Sep 19 Javascript
jQuery制作仿Mac Lion OS滚动条效果
Feb 10 Javascript
使用JavaScript实现旋转的彩圈特效
Jun 23 Javascript
noty ? jQuery通知插件全面解析
May 18 Javascript
js内置对象处理_打印学生成绩单的简单实现
Sep 24 Javascript
js中通过getElementsByName访问name集合对象的方法
Oct 31 Javascript
Vue组件开发初探
Feb 14 Javascript
d3.js入门教程之数据绑定详解
Apr 28 Javascript
BootStrap实现文件上传并带有进度条效果
Sep 11 Javascript
详解JavaScript中关于this指向的4种情况
Apr 18 Javascript
jQuery实现购物车表单自动结算效果实例
Aug 10 #Javascript
javascript中$(function() {});写与不写有哪些区别
Aug 10 #Javascript
jQuery中$(function() {});问题详解
Aug 10 #Javascript
jquery实现鼠标滑过后动态图片提示效果实例
Aug 10 #Javascript
jQuery模拟原生态App上拉刷新下拉加载更多页面及原理
Aug 10 #Javascript
jQuery 判断图片是否加载完成方法汇总
Aug 10 #Javascript
javascript实现连续赋值
Aug 10 #Javascript
You might like
thinkphp隐藏index.php/home并允许访问其他模块的实现方法
2016/10/13 PHP
thinkphp5修改view到根目录实例方法
2019/07/02 PHP
Thinkphp5 如何隐藏入口文件index.php(URL重写)
2019/10/16 PHP
JQuery中Text方法用法实例分析
2015/05/18 Javascript
ES6的新特性概览
2016/03/10 Javascript
JS DOMReady事件的六种实现方法总结
2016/11/23 Javascript
原生js和css实现图片轮播效果
2017/02/07 Javascript
javascript编程实现栈的方法详解【经典数据结构】
2017/04/11 Javascript
JavaScript队列函数和异步执行详解
2017/06/19 Javascript
Vue.set()实现数据动态响应的方法
2018/02/07 Javascript
vue-cli3中vue.config.js配置教程详解
2019/05/29 Javascript
jquery实现图片无缝滚动 蒙版遮蔽效果
2020/01/11 jQuery
Vue.js的模板语法详解
2020/02/16 Javascript
Node.js API详解之 module模块用法实例分析
2020/05/13 Javascript
Vue数据双向绑定原理实例解析
2020/05/15 Javascript
详解javascript脚本何时会被执行
2021/02/05 Javascript
[15:07]lgd_OG_m2_BP
2019/09/10 DOTA
在Python中使用列表生成式的教程
2015/04/27 Python
python通过apply使用元祖和列表调用函数实例
2015/05/26 Python
Python实现读取文件最后n行的方法
2017/02/23 Python
Python探索之爬取电商售卖信息代码示例
2017/10/27 Python
Anaconda入门使用总结
2018/04/05 Python
python实现植物大战僵尸游戏实例代码
2019/06/10 Python
tensorflow使用指定gpu的方法
2020/02/04 Python
pycharm内无法import已安装的模块问题解决
2020/02/12 Python
世界第一冲浪品牌:O’Neill
2016/08/30 全球购物
学期自我评价
2014/01/27 职场文书
航空学院求职信
2014/06/11 职场文书
汽车检测与维修专业求职信
2014/07/04 职场文书
2015年禁毒工作总结
2015/04/30 职场文书
企业宣传语大全
2015/07/13 职场文书
承诺书的签字人,需不需要承担相应的责任?
2019/07/09 职场文书
python基础详解之if循环语句
2021/04/24 Python
Python打包exe时各种异常处理方案总结
2021/05/18 Python
Vue3.0 手写放大镜效果
2021/07/25 Vue.js
从QQtabBar看css命名规范BEM的详细介绍
2021/08/07 HTML / CSS