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中防刷IP流量软件影响统计的一点对策
Jul 10 Javascript
JS实现可改变列宽的table实例
Jul 02 Javascript
基于javascript的COOkie的操作实现只能点一次
Dec 26 Javascript
详解JS面向对象编程
Jan 24 Javascript
Javascript 基础---Ajax入门必看
Jul 06 Javascript
Centos7 中安装 Node.js v4.4.4
Nov 03 Javascript
javascript输出AscII码扩展集中的字符方法
Dec 26 Javascript
日期时间范围选择插件:daterangepicker使用总结(必看篇)
Sep 14 Javascript
关于Angularjs中跨域设置白名单问题
Apr 17 Javascript
JS模拟实现哈希表及应用详解
May 04 Javascript
详解小程序开发经验:多页面数据同步
May 18 Javascript
vuex 实现getter值赋值给vue组件里的data示例
Nov 05 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
PHP5在Apache下的两种模式的安装
2006/09/05 PHP
基于PHP文件操作的详细诠释
2013/06/21 PHP
Thinkphp中的curd应用实用要点
2015/01/04 PHP
PHP SPL标准库之SplFixedArray使用实例
2015/05/12 PHP
基于JQuery 的消息提示框效果代码
2011/07/31 Javascript
Javascript实现滑块滑动改变值的实现代码
2013/04/12 Javascript
JQuery DataTable删除行后的页面更新利用Ajax解决
2013/05/17 Javascript
解决jquery中动态新增的元素节点无法触发事件问题的两种方法
2015/10/30 Javascript
JavaScript操作select元素和option的实例代码
2016/01/29 Javascript
在web中js实现类似excel的表格控件
2016/09/01 Javascript
AngularJS ngModel实现指令与输入直接的数据通信
2016/09/21 Javascript
Jquery uploadify 多余的Get请求(404错误)的解决方法
2017/01/26 Javascript
详解require.js配置路径的用法和css的引入
2017/09/06 Javascript
webpack中使用iconfont字体图标的方法
2018/02/22 Javascript
vue实现鼠标移入移出事件代码实例
2019/03/27 Javascript
修改vue源码实现动态路由缓存的方法
2020/01/21 Javascript
js 获取扫码枪输入数据的方法
2020/06/10 Javascript
Angular+Ionic使用queryParams实现跳转页传值的方法
2020/09/05 Javascript
详解nginx配置vue h5 history去除#号
2020/11/09 Javascript
Python help()函数用法详解
2014/03/11 Python
将Python代码嵌入C++程序进行编写的实例
2015/07/31 Python
Python脚本实现自动将数据库备份到 Dropbox
2017/02/06 Python
Python3多线程操作简单示例
2018/05/22 Python
python3基于TCP实现CS架构文件传输
2018/07/28 Python
pytorch 固定部分参数训练的方法
2019/08/17 Python
五分钟带你搞懂python 迭代器与生成器
2020/08/30 Python
Python 中 sorted 如何自定义比较逻辑
2021/02/02 Python
CSS3实现的渐变幻灯片效果
2020/12/07 HTML / CSS
MATCHESFASHION澳大利亚/亚太地区:英国时尚奢侈品电商
2020/01/14 全球购物
学雷锋活动总结范文
2014/04/25 职场文书
运动员获奖感言
2014/08/15 职场文书
中学生民族团结演讲稿
2014/08/27 职场文书
教师三严三实对照检查材料
2014/09/25 职场文书
学生逃课检讨书
2015/02/17 职场文书
2015秋季运动会通讯稿
2015/07/18 职场文书
导游词之阳朔遇龙河
2019/12/16 职场文书