在JavaScript中将数组作为函数参数传递

时间:2021-04-22 21:46:10

I'd like to call a function using an array as parameters:

我想用数组作为参数调用一个函数:

const x = ['p0', 'p1', 'p2'];
call_me(x[0], x[1], x[2]); // I don't like it

function call_me (param0, param1, param2 ) {
  // ...
}

Is there a better way of passing the contents of x into call_me()?

是否有更好的方法将x的内容传递给call_me()?

7 个解决方案

#1


319  

const args = ['p0', 'p1', 'p2'];
call_me.apply(this, args);

See MDN docs for Function.prototype.apply().

请参阅MDN文档了解函数.prototype.apply()。


If the environment supports ECMAScript 6, you can use a spread argument instead:

如果环境支持ECMAScript 6,您可以使用扩展参数代替:

call_me(...args);

#2


71  

Why don't you pass the entire array and process it as needed inside the function?

为什么不传递整个数组并根据需要在函数中进行处理呢?

var x = [ 'p0', 'p1', 'p2' ]; 
call_me(x);

function call_me(params) {
  for (i=0; i<params.length; i++) {
    alert(params[i])
  }
}

#3


41  

Assuming that call_me is a global function, so you don't expect this to be set.

假设call_me是一个全局函数,所以您不希望它被设置。

var x = ['p0', 'p1', 'p2'];
call_me.apply(null, x);

#4


31  

In ES6 standard there is a new spread operator ... which does exactly that.

在ES6标准中有一个新的扩展操作符…这就是这么做的。

call_me(...x)

It is supported by all major browsers except for IE.

除IE外,所有主要浏览器都支持它。

The spread operator can do many other useful things, and the linked documentation does a really good job at showing that.

扩展操作符可以做很多其他有用的事情,链接文档在显示这一点上做得很好。

#5


5  

As @KaptajnKold had answered

像@KaptajnKold回答

var x = [ 'p0', 'p1', 'p2' ];
call_me.apply(this, x);

And you don't need to define every parameters for call_me function either. You can just use arguments

你也不需要为call_me函数定义所有的参数。你可以使用参数

function call_me () {
    // arguments is a array consisting of params.
    // arguments[0] == 'p0',
    // arguments[1] == 'p1',
    // arguments[2] == 'p2'
}

#6


4  

Note this

注意这

function FollowMouse() {
    for(var i=0; i< arguments.length; i++) {
        arguments[i].style.top = event.clientY+"px";
        arguments[i].style.left = event.clientX+"px";
    }

};

//---------------------------

/ / - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

html page

html页面

<body onmousemove="FollowMouse(d1,d2,d3)">

<p><div id="d1" style="position: absolute;">Follow1</div></p>
<div id="d2" style="position: absolute;"><p>Follow2</p></div>
<div id="d3" style="position: absolute;"><p>Follow3</p></div>


</body>

can call function with any Args

可以调用函数与任何Args

<body onmousemove="FollowMouse(d1,d2)">

or

<body onmousemove="FollowMouse(d1)">

#7


-7  

1-you can join the array into an string
2-pass it to function
3-call split

1-你可以将数组加入一个字符串2中,将它传递给函数3-call split

var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(name)
{
    var nameArray = name.split(',');
.
.
.
}

call method:

调用方法:

myFunction(fruits.join(','));

or even

甚至

myFunction("orange,Apple,fruits");

#1


319  

const args = ['p0', 'p1', 'p2'];
call_me.apply(this, args);

See MDN docs for Function.prototype.apply().

请参阅MDN文档了解函数.prototype.apply()。


If the environment supports ECMAScript 6, you can use a spread argument instead:

如果环境支持ECMAScript 6,您可以使用扩展参数代替:

call_me(...args);

#2


71  

Why don't you pass the entire array and process it as needed inside the function?

为什么不传递整个数组并根据需要在函数中进行处理呢?

var x = [ 'p0', 'p1', 'p2' ]; 
call_me(x);

function call_me(params) {
  for (i=0; i<params.length; i++) {
    alert(params[i])
  }
}

#3


41  

Assuming that call_me is a global function, so you don't expect this to be set.

假设call_me是一个全局函数,所以您不希望它被设置。

var x = ['p0', 'p1', 'p2'];
call_me.apply(null, x);

#4


31  

In ES6 standard there is a new spread operator ... which does exactly that.

在ES6标准中有一个新的扩展操作符…这就是这么做的。

call_me(...x)

It is supported by all major browsers except for IE.

除IE外,所有主要浏览器都支持它。

The spread operator can do many other useful things, and the linked documentation does a really good job at showing that.

扩展操作符可以做很多其他有用的事情,链接文档在显示这一点上做得很好。

#5


5  

As @KaptajnKold had answered

像@KaptajnKold回答

var x = [ 'p0', 'p1', 'p2' ];
call_me.apply(this, x);

And you don't need to define every parameters for call_me function either. You can just use arguments

你也不需要为call_me函数定义所有的参数。你可以使用参数

function call_me () {
    // arguments is a array consisting of params.
    // arguments[0] == 'p0',
    // arguments[1] == 'p1',
    // arguments[2] == 'p2'
}

#6


4  

Note this

注意这

function FollowMouse() {
    for(var i=0; i< arguments.length; i++) {
        arguments[i].style.top = event.clientY+"px";
        arguments[i].style.left = event.clientX+"px";
    }

};

//---------------------------

/ / - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

html page

html页面

<body onmousemove="FollowMouse(d1,d2,d3)">

<p><div id="d1" style="position: absolute;">Follow1</div></p>
<div id="d2" style="position: absolute;"><p>Follow2</p></div>
<div id="d3" style="position: absolute;"><p>Follow3</p></div>


</body>

can call function with any Args

可以调用函数与任何Args

<body onmousemove="FollowMouse(d1,d2)">

or

<body onmousemove="FollowMouse(d1)">

#7


-7  

1-you can join the array into an string
2-pass it to function
3-call split

1-你可以将数组加入一个字符串2中,将它传递给函数3-call split

var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(name)
{
    var nameArray = name.split(',');
.
.
.
}

call method:

调用方法:

myFunction(fruits.join(','));

or even

甚至

myFunction("orange,Apple,fruits");