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

在JavaScript中将数组作为函数参数传递,javascript,arrays,function,call,Javascript,Arrays,Function,Call,我想使用数组作为参数调用函数: const x = ['p0', 'p1', 'p2']; call_me(x[0], x[1], x[2]); // I don't like it function call_me (param0, param1, param2 ) { // ... } 是否有更好的方法将x的内容传递到call_me() 有关详细信息,请参阅MDN文档 如果环境支持ECMAScript 6,则可以改用: 为什么不传递整个数组并根据需要在函数内部处理它呢 var x

我想使用数组作为参数调用函数:

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

function call_me (param0, param1, param2 ) {
  // ...
}
是否有更好的方法将
x
的内容传递到
call_me()

有关详细信息,请参阅MDN文档


如果环境支持ECMAScript 6,则可以改用:


为什么不传递整个数组并根据需要在函数内部处理它呢

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

function call_me(params) {
  for (i=0; i<params.length; i++) {
    alert(params[i])
  }
}
var x=['p0','p1','p2'];
叫我(x);
函数调用(参数){

for(i=0;i假设call_me是一个全局函数,所以您不希望设置它

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

正如@KaptajnKold所回答的那样

var x = [ 'p0', 'p1', 'p2' ];
call_me.apply(this, x);
您也不需要为call_me函数定义每个参数。 您只需使用
参数

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

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

};
函数FollowMouse(){
for(var i=0;i
//---------------------------

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>

遵循1

后续2

后续3

可以使用任何参数调用函数

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


在ES6标准中,有一个新的
..
正是这样做的

call_me(...x)
除IE外,所有主要浏览器都支持它

spread运算符可以做许多其他有用的事情,链接文档在这方面做得非常好。

函数参数也可以是数组: 函数foo([a,b,c],d){ 控制台日志(a、b、c、d); }
foo([1,2,3],4)
答案已经给出,但我只想小菜一碟。在JS的上下文中,你想要实现的是
方法借用
,即当我们从一个对象获取一个方法并在另一个对象的上下文中调用它时。获取数组方法并将其应用于参数是很常见的。让我给你一个例子嗯

所以我们有一个“超级”散列函数,它将两个数字作为参数,并返回“超级安全”散列字符串:

function hash() {
  return arguments[0]+','+arguments[1];
}

hash(1,2); // "1,2" whoaa
到目前为止还不错,但我们对上述方法没有什么问题,它是受限制的,只适用于两个数字,这不是动态的,让我们让它适用于任何数字,而且你不必通过数组(如果你仍然坚持的话,你可以)。好了,说够了,让我们战斗吧

自然的解决方案是使用
arr.join
方法:

function hash() {
  return arguments.join();
}

hash(1,2,4,..); //  Error: arguments.join is not a function
哦,老兄。不幸的是,这行不通。因为我们正在调用散列(参数),参数对象既可以是iterable的,也可以是类似数组的,但不是真正的数组。下面的方法怎么样

function hash() {
  return [].join.call(arguments);
}

hash(1,2,3,4); // "1,2,3,4" whoaa
这个技巧叫做方法借用。

我们从常规数组中借用了
join
方法
[].join.
并使用
[].join.call
参数的上下文中运行它

它为什么有效

这是因为本机方法
arr.join(glue)
的内部算法非常简单

几乎“按原样”取自规范:

Let glue be the first argument or, if no arguments, then a comma ",".
Let result be an empty string.
Append this[0] to result.
Append glue and this[1].
Append glue and this[2].
…Do so until this.length items are glued.
Return result.

因此,从技术上讲,它将这个[0]、这个[1]……等连接在一起。它是以一种允许任何类似这样的数组的方式编写的(不是巧合,许多方法都遵循这种做法)。这就是为什么它也适用于
this=参数。

使用扩展运算符时,必须注意它必须是最后一个或唯一传递的参数。否则它将失败

function callMe(...arr){ //valid arguments
    alert(arr);
}

function callMe(name, ...arr){ //valid arguments
    alert(arr);
}

function callMe(...arr, name){ //invalid arguments
    alert(arr);
}
如果需要传递数组作为起始参数,可以执行以下操作:

function callMe(arr, name){
    let newArr = [...arr];
    alert(newArr);
}

可以以更基本的形式使用排列运算符

[].concat(...array)
对于返回数组但预期作为参数传递的函数

例如:

function expectArguments(...args){
  return [].concat(...args);
}

JSON.stringify(expectArguments(1,2,3)) === JSON.stringify(expectArguments([1,2,3]))


这是因为我无法修改call_me()。它是在其他库中定义的,不可能弄乱API。+1因为即使它没有回答最初的问题,也可能是浏览此页面的10多万人正在寻找的。有人能解释一下“call_me(x)”是什么吗line正在做什么?它似乎是一个没有function关键字的函数名?它到底在做什么?@swam它是对
call\u me
函数的调用。它只是在末尾缺少分号。@swam它正在执行声明的call\u me(params)函数。顺便说一句,如果有人想传递一个关联数组(命名键)取而代之的是,然后使用一个对象。来自PHP(并且总是被google引导到这个线程)这让我花了一段时间才弄明白。你可以将整个对象作为一个参数传递。谢谢你指出“spread”参数!我不知道它。@timhc-你的旁注注释很有趣,但我无法解析它(我是一个javascript noob,正在学习一些教程)。在JS中,关联数组是几个教程中的一个对象。@timhc22,当使用json对象作为参数传递给函数时,不要忘记为了更好的可读性,这显然是答案的一部分。“参数”在调用后,确实需要获取阵列。谢谢!这是一种非常糟糕的做法…如果查看函数,您将无法看到函数需要什么,并且每个参数都是可选的。新链接:
function callMe(arr, name){
    let newArr = [...arr];
    alert(newArr);
}
[].concat(...array)
function expectArguments(...args){
  return [].concat(...args);
}

JSON.stringify(expectArguments(1,2,3)) === JSON.stringify(expectArguments([1,2,3]))