使用参数数组调用函数

Question

我可以在JavaScript中以方便的方式调用带有参数数组的函数吗？

例:

var fn = function() {
    console.log(arguments);
}

var args = [1,2,3];

fn(args);

我需要的arguments是[1,2,3],就像我的数组.

Answer 1

你应该使用apply:

const args = [1,2,3];

fn(...args);

function fn() {
  console.log(arguments);
}

Apply将进行等效的函数调用:

var args = [1,2,3];
fn.apply(null, args);

function fn() {
  console.log(arguments);
}

请注意,我用作null第一个参数apply,将this关键字设置为全局对象(window)fn.

另外你应该知道undefined对象实际上不是一个数组,它是一个类似数组的对象,它包含与用于调用函数的参数对应的数字索引,一个arguments给出所用参数数量的length属性,以及属性这是对执行函数的引用(对匿名函数的递归很有用).

如果要从arguments对象创建数组,可以使用以下Array.prototype.slice方法:

fn(1,2,3);

编辑:回答您的评论,是的,您可以使用该shift方法并将其返回值设置为this您的函数上下文(关键字):

function fn(...args) {
  args.forEach(arg => console.log(arg))
}

fn(1,2,3)

但请记住,这shift将从原始数组中删除第一个元素,并且在没有第一个参数的情况下将调用您的函数.

如果您仍需要使用所有其他参数调用函数,则可以:

function fn() {
  var args = Array.prototype.slice.call(arguments);
  console.log(args);
}

fn(1,2,3);

如果您不想更改上下文,则可以简单地提取函数内的第一个参数:

fn.apply(args.shift(), args);

Answer 2

在ECMAScript 6中,您可以使用spread语法(...)来实现此目的.它比简单易懂更容易理解Function.prototype.apply().

代码示例:

const fn = function() {
  console.log(arguments);
}

const args = [1,2,3];

fn(...args);