www.bifa88.com 2

函数中的www.bifa88.com

轻松学习 JavaScript (4):函数中的 arguments 对象

2017/11/11 · JavaScript
· arguments

原文出处: Dhananjay
Kumar   译文出处:码农网

小峰   

JavaScript函数具有像数组一样的对象,这些对象称为arguments,与传递给函数的参数相对应。传递给JavaScript函数的所有参数都可以使用arguments对象来引用。

现在我们开始学习,仔细看下面列出的代码:

function add(num1, num2) { var res = num1 + num2; return res; } var r =
add(7, 8); console.log(r);

1
2
3
4
5
6
function add(num1, num2) {
    var res = num1 + num2;
    return res;
}
var r = add(7, 8);
console.log(r);

在上面的函数中,num1和num2是两个参数。你可以使用名为num1和num2的arguments来引用这些参数。除了arguments名称之外,你还可以使用JavaScript数组,如对象arguments来引用它们。所以,上面的函数可以重写,如下所示:

function add(num1, num2) { var res = arguments[0] + arguments[1];
return res; } var r = add(7, 8); console.log(r);

1
2
3
4
5
6
function add(num1, num2) {
    var res = arguments[0] + arguments[1];
    return res;
}
var r = add(7, 8);
console.log(r);

在JavaScript函数中,arguments对象用于访问或引用传递给函数的所有参数。arguments对象是可用于函数的局部变量。arguments对象的长度相当于传递给函数的arguments数量。请看下面的代码,作为输出将得到2,因为有两个arguments传递给函数:

function add(num1, num2) { var res = arguments.length; return res; } var
r = add(7, 8); console.log(r);

1
2
3
4
5
6
function add(num1, num2) {
    var res = arguments.length;
    return res;
}
var r = add(7, 8);
console.log(r);

JavaScript函数具有像数组一样的对象,这些对象称为arguments,与传递给函数的参数相对应。传递给JavaScript函数的所有参数都可以使用arguments对象来引用。

JavaScript函数可以使用任意数量的参数。与其他语言(如C#和Java)不同,你可以在调用JavaScript函数时传递任意数量的参数。JavaScript函数允许未知数量的函数参数。在ECMAScript
6之前,JavaScript有一个变量来访问这些未知或可变数目的参数,这是一个类似数组的对象,并非一个数组。细想以下代码来理解arguments变量:

arguments对象不是纯数组

JavaScript的arguments对象不是纯粹的JavaScript数组。你不能对arguments对象执行诸如push,pop,slice等操作。正如你将在下面列出的代码中所看到的那样,执行push操作会引发异常,因为arguments.push不是函数。

function add(num1, num2) { arguments.push(78); var res = num1 + num2;
return res; }

1
2
3
4
5
function add(num1, num2) {
    arguments.push(78);
    var res = num1 + num2;
    return res;
}

 

 

可以设置arguments对象

你可以在arguments对象数组中设置特定的项。首先,你可以使用索引0设置数组的第一个项,如下所示:

function add(num1, num2) { arguments[0] = 15; var res = num1 + num2;
return res; } var r = add(7, 8); console.log(r);

1
2
3
4
5
6
7
function add(num1, num2) {
    arguments[0] = 15;
    var res = num1 + num2;
    return res;
}
var r = add(7, 8);
console.log(r);

在add函数中,num1和arguments[0]引用相同的值。所以,当你更新arguments[0]时,num1的值也会被更新。对于上面的代码,输出将是23。

现在我们开始学习,仔细看下面列出的代码:

function add(){

    var result class=”Apple-converted-space”> = class=”Apple-converted-space”> 0;

    for(let class=”Apple-converted-space”> i=0;i<arguments.length;i++){

        result = class=”Apple-converted-space”> result class=”Apple-converted-space”> + class=”Apple-converted-space”> arguments[i];

    }

    return result;

}

var r class=”Apple-converted-space”> = class=”Apple-converted-space”> add(6,9,3,2);

console.log(r);

var t class=”Apple-converted-space”> = class=”Apple-converted-space”> add(7,56,9);

console.log(t);

将arguments对象转换为数组

正如我们在这篇文章中介绍的那样,JavaScript函数arguments对象不是纯数组。除了长度属性外,它没有任何其他属性。但是,你可以使用Array.prototype.slice.call将arguments对象转换为数组,如下所示:

function add(num1, num2) { var arg =
Array.prototype.slice.call(arguments); console.log(arg.pop()); }

1
2
3
4
function add(num1, num2) {
    var arg = Array.prototype.slice.call(arguments);
    console.log(arg.pop());
}

在ECMAScript 6中,你可以将arguments对象转换为一个数组,如下所示:

function add(num1, num2) { var arg = Array.from(arguments);
console.log(arg.pop()); }

1
2
3
4
function add(num1, num2) {
    var arg = Array.from(arguments);
    console.log(arg.pop());
}

 

 

结论

总而言之,关于arguments对象需要谨记的一些重要事情有:

  • arguments对象的长度等于传递给函数的参数的数量。
  • arguments对象是类似数组的对象,但不是JavaScript数组。
  • 你不能对arguments对象使用其他JavaScript数组方法,例如push,pop,slice等等。
  • JavaScript
    arguments对象索引从零开始。所以第一个参数将被arguments[0]引用,第二个参数将被arguments[1]引用,等等。

简单地说,JavaScript
arguments对象是一个类似数组的对象,它引用传递给函数的参数。在ECMAScript
6中,引入的rest参数现已被广泛用来替代函数中的arguments对象用于变量数或参数。

在这个“轻松JavaScript”系列的下一篇文章中,我们将介绍JavaScript函数中的类。

1 赞 收藏
评论

www.bifa88.com 1

function add(num1, num2) {

    var res = num1 + num2;

    return res;

}

var r = add(7, 8);

console.log(r);

如你所见,arguments对象用于访问未知或可变的函数参数。即使arguments使用length属性和方括号,它也不是一个真正的JavaScript数组。你不能对arguments对象使用其他JavaScript数组方法,如pop,push,slice等。在使用arguments时存在的一些问题是:

 

 

在上面的函数中,num1和num2是两个参数。你可以使用名为num1和num2的arguments来引用这些参数。除了arguments名称之外,你还可以使用JavaScript数组,如对象arguments来引用它们。所以,上面的函数可以重写,如下所示:

  • JavaScript函数arguments对象不是一个真正的JavaScript数组;因此,你不能使用其他数组方法,如pop,push,slice等。

  • 在内部函数中访问外部函数的arguments对象是很困难的。要访问的话,你需要在变量中分配外部函数的arguments函数,然后在内部函数中使用它。

  • 如果你想要使用arguments对象作为数组,那么你需要通过Aarry.prototype.slice手动转换。

 

 

function add(num1, num2) {

    var res = arguments[0] + arguments[1];

    return res;

}

var r = add(7, 8);

console.log(r);

ECMAScript
6引入了一个新功能,Rest参数,它表示一个未知数量的参数作为函数中的一个数组。它不仅将额外的参数表示为数组,还解决了arguments对象的许多问题。使用rest参数重写上面的add函数。

 

 

在JavaScript函数中,arguments对象用于访问或引用传递给函数的所有参数。arguments对象是可用于函数的局部变量。arguments对象的长度相当于传递给函数的arguments数量。请看下面的代码,作为输出将得到2,因为有两个arguments传递给函数:

function add(…theArgs){

    var result class=”Apple-converted-space”> = class=”Apple-converted-space”> 0;

    for(let class=”Apple-converted-space”> i=0;i<theArgs.length;i++){

        result = class=”Apple-converted-space”> result class=”Apple-converted-space”> + class=”Apple-converted-space”> theArgs[i];

    }

    return result;

}

var r class=”Apple-converted-space”> = class=”Apple-converted-space”> add(6,9,3,2);

console.log(r);

var t class=”Apple-converted-space”> = class=”Apple-converted-space”> add(7,56,9);

console.log(t);

 

 

function add(num1, num2) {

    var res = arguments.length;

    return res;

}

var r = add(7, 8);

console.log(r);

你可以将rest参数定义为…theArgs或…
args。如果最后命名的函数参数以…(三个点)作为前缀,那么它将成为函数的rest参数。JavaScript函数的rest参数是纯JavaScript数组。在上面的代码中,…theArgs是函数add的rest参数,因为它是唯一的命名参数,且也以…(三个点)作为前缀。由于rest参数是JavaScript数组,所以你可以对rest参数theArgs执行诸如push,pop等操作,如下面的代码所示:

 

 

arguments对象不是纯数组

function add(…theArgs){

    theArgs.push(10);

    var result class=”Apple-converted-space”> = class=”Apple-converted-space”> 0;

    for(let class=”Apple-converted-space”> i=0;i<theArgs.length;i++){

        result = class=”Apple-converted-space”> result class=”Apple-converted-space”> + class=”Apple-converted-space”> theArgs[i];

    }

    var lastItem  = class=”Apple-converted-space”> theArgs.pop();

    console.log(lastItem);

    return result;

}

 

 

JavaScript的arguments对象不是纯粹的JavaScript数组。你不能对arguments对象执行诸如push,pop,slice等操作。正如你将在下面列出的代码中所看到的那样,执行push操作会引发异常,因为arguments.push不是函数。

JavaScript函数的rest参数也可以与其他参数一起工作。如果你不想在rest参数数组中包含特定参数的话,那么你可能需要在函数中使用其他命名参数。细想以下代码块:

 

 

function add(num1, num2) {

    arguments.push(78);

    var res = num1 + num2;

    return res;

}

function add(num1, class=”Apple-converted-space”> num2, class=”Apple-converted-space”> …theArgs){

    console.log(num1);

    console.log(num2);

    console.log(theArgs.length);

}

var r class=”Apple-converted-space”> = class=”Apple-converted-space”> add(6,9,3,2);

var t class=”Apple-converted-space”> = class=”Apple-converted-space”> add(7,56,9);

 

 

可以设置arguments对象

对于第一次函数调用,6和9将分别分配给num1和num2。对于第二个函数调用,7和56将被分配给num1和num2。启动第三个参数的参数将被分配给rest参数数组。请记住,前两个参数不会成为rest参数数组的一部分。所以,如果你打算将所有的值都包含在rest参数中,那么你应该一开始就将它们定义为用逗号分隔的命名参数。下面给出的代码将会导致错误:

 

 

你可以在arguments对象数组中设置特定的项。首先,你可以使用索引0设置数组的第一个项,如下所示:

function add(num1, class=”Apple-converted-space”> …theArgs,num2){

    console.log(num1);

    console.log(num2);

    console.log(theArgs.length);

}

 

 

function add(num1, num2) {

    arguments[0] = 15;

    var res = num1 + num2;

    return res;

}

var r = add(7, 8);

console.log(r);

在上面的代码中,rest参数不是最后一个参数,所以JavaScript会抛出错误。rest参数必须是最后一个正式参数。

 

 

在add函数中,num1和arguments[0]引用相同的值。所以,当你更新arguments[0]时,num1的值也会被更新。对于上面的代码,输出将是23。

www.bifa88.com 2

 

 

将arguments对象转换为数组

 

 

JavaScript允许你破坏rest参数,这意味着你可以将rest变量数据解包为不同的变量名称。请看下面的代码:

正如我们在这篇文章中介绍的那样,JavaScript函数arguments对象不是纯数组。除了长度属性外,它没有任何其他属性。但是,你可以使用Array.prototype.slice.call将arguments对象转换为数组,如下所示:

 

 

function add(…[a,b,c]){

    return a+b+c;

}

var r class=”Apple-converted-space”> = class=”Apple-converted-space”> add(6);

console.log(r);

var t class=”Apple-converted-space”> = class=”Apple-converted-space”> add(7,56,9);

console.log(t);

function add(num1, num2) {

    var arg = Array.prototype.slice.call(arguments);

    console.log(arg.pop());

}

 

 

第一次函数调用,将分配a = 6,b = undefined,c =
undefined,第二次函数调用,将分配a = 7,b = 56,c =
9。在此例子中,函数将忽略传递的任何额外的参数。

在ECMAScript 6中,你可以将arguments对象转换为一个数组,如下所示:

 

 

JavaScript函数的rest参数是对arguments对象使用函数未知参数的一个巨大改进。它是一个纯JavaScript数组;因此,你可以对它使用所有数组方法。你可以将rest变量数据解包到命名变量中。你可以给rest参数指定任何名称,这又是一个使用arguments关键字的重大改进。

function add(num1, num2) {

    var arg = Array.from(arguments);

    console.log(arg.pop());

}

 

 

结论

 

总而言之,关于arguments对象需要谨记的一些重要事情有:

 

  • arguments对象的长度等于传递给函数的参数的数量。

  • arguments对象是类似数组的对象,但不是JavaScript数组。

  • 你不能对arguments对象使用其他JavaScript数组方法,例如push,pop,slice等等。

  • JavaScript
    arguments对象索引从零开始。所以第一个参数将被arguments[0]引用,第二个参数将被arguments[1]引用,等等。

 

简单地说,JavaScript
arguments对象是一个类似数组的对象,它引用传递给函数的参数。在ECMAScript
6中,引入的rest参数现已被广泛用来替代函数中的arguments对象用于变量数或参数。