Javascript：函数的“无限”参数？

Question

在 Chrome 中，当我在下面输入console.log 时：

console.log("A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter");

...它正确打印它，没有错误或警告。我附加了更多参数，但它仍然可以正确打印出来。

console.log("A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter", "A parameter");

我怎样才能有一个像那个一样的“无限”参数函数？

Answer 1

函数可以访问一个名为 arguments 的类数组对象，该对象包含它们收到的所有参数

function print_my_arguments(/**/){
    var args = arguments;
    for(var i=0; i<args.length; i++){
        console.log(args[i]);
    }
};

您可以使用 apply 方法进行相反的转换（调用给定参数列表的函数）：

// These are equivalent:
print_my_arguments(1,2,3);
print_my_arguments.apply(null, [1,2,3]);

// The first parameter to `apply` is the `this`.
// It is used when the function is a method.
foo.bar(1,2,3);
var f = foo.bar; f.apply(foo, [1,2,3]);

需要注意的一些要点：

1. arguments 不是一个实际的数组，它没有任何常用的数组方法（切片、连接等）。您可以使用以下行将其转换为数组：

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

2. 如果您希望数组仅包含接收到的未命名参数，则切片也很有用：

   function foo(first_arg, second_arg /**/){
       var variadic_args = Array.prototype.slice.call(arguments, 2);
   }
   

3. 并非每个浏览器都可以处理任意数量的函数参数。上次我对此进行测试时，在 Chrome 和 IE 中，在大约 200.000 个参数之后出现了 stackoverflow。如果您的函数可以接收任意数量的参数，请考虑将所有这些参数打包到一个常规数组中。

4. 那些出现在我的示例的参数列表中的/**/ cmets 不是强制性的。它们只是我用来标记可变参数函数并将它们与常规函数区分开来的编码约定。

   // A quick glance would suggest that this function receives no
   // parameters but actually it is a variadic function that gets
   // its parameters via the `arguments` object.
   function foo(){
       console.log(arguments.length);
   }
   

Answer 2

现代的做法是使用rest parameters:

function printArguments(...args) {
  args.forEach((arg, index) => {
    console.log(`Argument ${index}:`, arg);
  });
}

printArguments('hello', true, new Date());

通过使用...args 语法，所有参数都保存在一个名为args 的数组中。

除了 Internet Explorer，所有浏览器都已在其最新版本中提供此功能。

小提琴：https://jsfiddle.net/Lbf0stst/

Answer 3

您可以使用参数数组：jsfiddle.net/kUnJ2/

function foo() {
    for (var i = 0; i < arguments.length; i++) {
        document.body.innerHTML += arguments[i];
    }
}


foo("There ", "are ", "as ", "much ", "arguments ", "as ", "you ", "want.");