【Javascript 拾遗之四】arguments callee caller 三巨头

话说要精通一门语言不易，也许一直开发Javascript的前端码农，对这三个关键词arguments,callee,caller也不一定熟悉。呵呵,不信你就自检下，能说出几个？本人做JS开发3年对arguments了解一点而已（平时不大用）。其他两个只在书上看到过，没怎么深究。那么本文我们就一起来讨论下这个三个关键词吧。

 

arguments callee caller 三巨头

1、arguments 定义

在之前的文章中（详见【javascript 拾遗之一】call 和 applay函数一文），我们已经知道arguments 是一个函数的内置对象类型，它是表示当前执行函数的参数列表key:value形式和length属性的对象，包含所有实参和参数个数。如下：

arguments = {

　　0 : arg0,

      1 : arg1,

      ....

　　N-1 : argN

      length : N

}

调用方法[functionName.]agruments

直接alert(arguments)返回的是[object Arguments]可见它是一种特殊的js内置对象。通过arguments[0]返回函数接受到的第一个参数，（注意这是对象调用属性的方法，不是数组调用索引的方式，Object[key] 等同于 Object.key)， 通过arguments.length返回参数的个数，准确地说应该是实参的个数，大家可以测试下，设置多个实参，不设置形参，打印返回的值。而形参的个数可以通过argument.callee.length得到，第二节中介绍callee。

直接在函数中使用arguments不是很方便，因为它是一个对象类型，不利于遍历。so我们可以用Array.prototype.slice.call(arguments)来得到参数数组。下面来看一个arguments定义的测试例子。

 

var fun = function(aa, bb){
    console.warn(arguments);             //[1, 2] 等同于 console.warn(fun.arguments);
    alert(arguments);                    //[object Arguments]
    console.warn(arguments.length);      //2
    console.warn(typeof arguments);      //object
}
fun(1, 2);

1.1 arguments 作为可变参数函数的应用

实例中，我们可以任意添加sumUp函数的参数，并返回这些参数的和。

var sumUp = function(){
    var total = 0;
    for(var i = 0; i < arguments.length, !isNaN(arguments); i ++){
        total += arguments[i];
    }
    return total;
}
console.log(sumUp(1,2,3)); // 6
console.log(sumUp(1,2,3,4,5)); // 15

 

1.2 待续置位

1.3 待续置位

2、callee

callee是内置对象arguments的一个属性，通过调用 [functionName.]arguments.callee 返回当前执行函数的实体。

2.1 判断形参和实参的长度

callee的length参数表示形式参数的个数，可结合arguments.length用来判断实参和形参长度是否匹配。如下测试例子：

function calleeLengthDemo(arg1, arg2) {
    if (arguments.length == arguments.callee.length) {
          console.warn("验证形参和实参长度正确！");
        return;
      } else {
          console.warn("实参长度：" +arguments.length); //3
          console.warn("形参长度： " +arguments.callee.length); //2
      }
}
calleeLengthDemo(1,2,3);

 

3、caller

caller和arguments是同一级别的，通过调用[functionName.]caller 返回调用当前执行函数的函数，如果是此函数是顶层函数（即是全局函数，window对象下的函数），则返回null。详细见代码如下：

function callerDemo() {
    if (callerDemo.caller) {
        console.warn(typeof callerDemo.caller);    //function
        console.warn(typeof callerDemo.arguments.callee);    //function
        var a= callerDemo.caller.toString();
          alert(a);
        var b= callerDemo.arguments.callee.toString();
          alert(b);
      } else {
          console.warn("This is a global function");
      }
}
      callerDemo(); // This is a global function
function handleCaller() {
       callerDemo();
}
handleCaller();

 

5、总结

arguments 的应用其实有很多，形式多样，也可以和callee结合使用，本文只列举了几个例子，因此在开发中要举一反三，灵活应用才能得心应手。callee和caller很少使用到这两个属性，很多时候可以用函数的引用替代，但是我们也要能看懂吧，至少它们也是Javascript的一部分。

 

6、参考资料

http://hahha2003.blog.163.com/blog/static/2485779200961902819231/