js中arguments详解

image.png

一、简介

了解arguments这个对象之前先来认识一下javascript的一些功能：
其实Javascript并没有重载函数的功能，但是Arguments对象能够模拟重载。Javascrip中每个函数都会有一个Arguments对象实例arguments，它引用着函数的实参，可以用数组下标的方式"[]"引用arguments的元素。arguments.length为函数实参个数，arguments.callee引用函数自身。

image.png
image.png

arguments.callee与形参是一一映射

image.png image.png

二、特点

1.arguments对象和Function是分不开的。

2.因为arguments这个对象不能显式创建。

3.arguments对象只有函数开始时才可用。

三、使用方法

虽然arguments对象并不是一个数组（类数组），但是访问单个参数的方式与访问数组元素的方式相同

例如：
arguments[0],arguments[1],。。。arguments[n]； 在js中 不需要明确指出参数名，就能访问它们

例如：

function test() {
        var s = "";
        for (var i = 0; i < arguments.length; i++) {
            alert(arguments[i]);
            s += arguments[i] + ",";
        }
        return s;
}
test("name", "age");

输出结果：
name,age

我们知道每一个对象都有自己的属性，arguments对象也不例外，首先arguments的访问犹如Array对象一样，用0到arguments.length-1来枚举每一个元素。下面我们来看看callee属性，返回正被执行的** Function** 对象，也就是所指定的 Function 对象的正文。callee 属性是 arguments 对象的一个成员，仅当相关函数正在执行时才可用。callee 属性的初始值就是正被执行的** Function** 对象。实现匿名的递归函数。代码如下：

var sum = function (n) {
        if (1 == n) {
            return 1;
        } else {
            return n + arguments.callee(n - 1); //6 5 4 3 2 1
        }
   }
   alert(sum(6));

输出结果：21

通俗一点就是，arguments此对象大多用来针对同个方法多处调用并且传递参数个数不一样时进行使用。根据arguments的索引来判断执行的方法。

知识扩展：

当使用arguments进行函数传递时，有一些需要注意的点。例子如下：

var length = 10;
function fn() {
  console.log(this.length);
}

var obj = { 
  method: function(fn) {
    fn();
    arguments[0]();
  }
};

obj.method(fn, 1); 

输出：10,2

这里有2个需要注意的点。fn函数里面的this的指向：

1.第一个值为10，执行的是method里面的第一行"fn()",这里this指向的window。所以输出的值为最外层定义的length。

2.第二个值为2，执行的是method里面的第二行"arguments0"（arguments0 => fn() ），这里this执行的是arguments这个对象,所以输出值为arguments的长度

arguments 的用法和特性基本就是这么多了。可能callee属性用到的比较少。但是如果自己封装或者写一些js的时候 除了callee的东西基本都会用到。有不对的地方希望朋友们多多支出。大家共同进步。

传多个参数事可以直接用argument，比如求最大值：

 function max() {
        var max = arguments[0];
        console.log(arguments)

        for (val of arguments) {
            if (val >= max) {
                max = val;
            }
        }
        return max;
    }
    var maxValue = max('9', 1, 2, 4)
    console.log(maxValue)