Do you know what are the uses of the Arguments object in JavaScript?

Summary of the purpose of the Arguments object in JavaScript.

Preface

I believe that many of us have used a special object-Arguments object in the process of code development.

In actual development, the Arguments object is very useful. Flexible use of Arguments objects can improve the flexibility of using functions and enhance the adaptability and error correction capabilities of functions in abstract programming.

So how do you use the Arguments object? Today we will summarize.

Basic concepts of Arguments

class array object corresponding to the parameters passed to the function.

Arguments is an object similar to an array but not an array. It is said that it is similar to an array because it has the same access properties and methods as an array. It can arguments[n] , and has an array length attribute length. Also, the Arguments object stores the parameters actually passed to the function, not limited to the parameter list defined by the function declaration, and cannot explicitly create the Arguments object.

The following is a simple example of using Arguments:

function func1(a, b, c) {
    console.log(arguments[0]);
    console.log(arguments[1]);
    console.log(arguments[2]);
}

func1(1, 2, 3);
// 1
// 2
// 3

arguments inside the function, and then get the parameter value of the corresponding position in the form of the obtained value of the array.

The role of Arguments

As a special object in JavaScript, what are the uses of Arguments, or how to use it?

Get the number of actual and formal parameters

Use the arguments.length property to get the number of actual parameters of the function. Use the length property of the function object to get the number of formal parameters of the function. This property is a read-only property and can be used both inside and outside the function body.

The following example designs a checkArg() function to check whether the formal parameters and actual parameters of a function are consistent, and throw an exception if they are inconsistent.

function checkArg(a) {
    //检测函数实参与形参是否一致
    if (a.length != a.callee.length)
        //如果实参与形参个数不同，则抛出错误
        throw new Error("实参和形参不一致");
}

function f(a, b) {
    //求两个数的平均值
    checkArg(arguments); //根据arguments来检测函数实参和形参是否一致
    return ((a * 1 ? a : 0) + (b * 1 ? b : 0)) / 2; //返回平均值
}
console.log(f(6)); //抛出异常。调用函数f，传入一个参数

Modify the actual parameter value

In the following example, a for loop is used to traverse the arguments object, and then the value of the loop variable is passed to the arguments, so that the actual parameter value can be changed.

function f() {
    for (let i = 0; i < arguments.length; i++) {  //遍历arguments对象
        arguments[i] = i;  //修改每个实参的值
        console.log(arguments[i]);  //提示修改的实参值
    }
}

f(3, 3, 6);  //返回提示0、1、2，而不是3、3、6

Change the number of actual parameters

By modifying the value of the length attribute, the number of actual parameters of the function can also be changed. When the value of the length property increases, the value of the increased actual parameter is undefined; if the value of the length property decreases, the value of the actual parameter after the length value is discarded.

function f() {
    arguments.length = 2; //修改arguments属性对象的length属性值
    for (let i = 0; i < arguments.length; i++) {
        console.log(arguments[i]);
    }
}

f(3, 3, 6); //返回提示3、3

Validity of testing parameters

In the following example, use arguments.callee to get the anonymous function, and then get the number of function parameters through the length property of the function, and finally compare the number of actual parameters with the number of parameters to check whether the parameters passed by the user meet the requirements.

function f(x,y,z) {
    let a = arguments.length;  //获取函数实参的个数
    let b = arguments.callee.length;  //获取函数形参的个数
    if (a != b){  //如果实参和形参个数不相等，则提示错误信息
        throw new Error("传递的参数不匹配");
    }else {  //如果实参和形参个数相同，则返回它们的和
        return x + y + z;
    }
}

console.log(f(3,4,5));  //返回值12

arguments.callee is equivalent to the function name. In the above example, arguments.callee is equal to f.

When the number of function parameters is uncertain, it is used to access the actual parameter value of the calling function

If the number of parameters of the function is uncertain, or there are many parameters of the function, and you don't want to define each parameter one by one, you can omit the definition parameters and directly use the Arguments object in the function body to access the actual parameter values of the calling function.

The following example defines a function for averaging, which uses the arguments object to calculate the average value of the parameters. When calling a function, you can pass in any number of parameters.

function avg() {
    //求平均值
    let num = 0;
    let length = 0; //声明并初始化临时变量
    for (let i = 0; i < arguments.length; i++) {
        //遍历所有实参
        if (typeof arguments[i] != "number") {
            //如果参数不是数值
            continue; //则忽略该参数值
        }
        num += arguments[i]; //计算参数的数值之和
        length++; //计算参与和运算的参数个数
    }

    return num / length; //返回平均值
}

console.log(avg(1, 2, 3, 4)); //返回2.5
console.log(avg(1, 2, "3", 4)); //返回2.3333333333333335

Traverse or access the value of the actual parameter

The arguments object is a pseudo-class array, not an array. You can traverse or access the value of the actual parameter through the length attribute and bracket syntax. However, by dynamically calling methods, you can also use array methods, such as push, pop, slice, etc.

The following example uses the method of dynamic call to make the arguments object call the array method slice(), which can convert the parameter object of the function into an array.

function f() {
    return [].slice.apply(arguments);
    // 也可以使用如下写法
    // return Array.from(arguments);
    // return [...arguments];
}
console.log(f(1, 2, 3, 4, 5, 6)); //返回[1,2,3,4,5,6]

Summarize

The above is a summary of the actual use of the Arguments object. I hope we can all use Arguments flexibly and write poetry-like code!

If you still know more uses, please leave a message in the comment area below to communicate 😁

~

~ End of this article, thanks for reading!

~

Learn interesting knowledge, meet interesting friends, and create interesting souls!

Hello everyone, I am the author Programming Samadhi ] 161336ddc3a74c Hermit King , and my public is "161336ddc3a74e Programming Samadhi ", welcome to pay attention, I hope you can give your advice!

Come, with expectations, I have Moxiang to greet you! You return, no matter the gains or losses, only with the lingering rhyme as a gift!

Pay equal attention to knowledge and skills, both internal and external skills, both theory and practice must be grasped, and both hands must be hard!