Passer un tableau comme paramètre de fonction dans JavaScript

j'aimerais appeler une fonction utilisant un tableau comme paramètres:

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

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

y a-t-il une meilleure façon de passer le contenu de x dans call_me() ?

233
demandé sur Robert 2010-05-18 13:42:00
la source

9 ответов

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

voir docs MDN Function.prototype.apply() .


si L'environnement supporte ECMAScript 6, Vous pouvez utiliser un spread argument à la place:

call_me(...args);
335
répondu KaptajnKold 2016-12-11 19:04:58
la source

pourquoi ne pas passer le tableau entier et le traiter comme nécessaire à l'intérieur de la fonction?

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

function call_me(params) {
  for (i=0; i<params.length; i++) {
    alert(params[i])
  }
}
76
répondu Karl Johan 2016-01-20 23:06:28
la source

en supposant que call_me est une fonction globale, donc vous ne vous attendez pas à ce qu'elle soit définie.

var x = ['p0', 'p1', 'p2'];
call_me.apply(null, x);
41
répondu plexer 2010-05-18 14:05:19
la source

dans la norme ES6 il y a un nouveau " spread operator ... qui fait exactement cela.

call_me(...x)

il est supporté par tous les principaux navigateurs sauf IE.

l'opérateur de propagation peut faire beaucoup d'autres choses utiles, et la documentation liée fait un très bon travail pour montrer cela.

33
répondu BoltKey 2018-04-16 21:58:50
la source

comme @KaptajnKold avait répondu

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

et vous n'avez pas besoin de définir tous les paramètres pour la fonction call_me non plus. Vous pouvez simplement utiliser arguments

function call_me () {
    // arguments is a array consisting of params.
    // arguments[0] == 'p0',
    // arguments[1] == 'p1',
    // arguments[2] == 'p2'
}
5
répondu 徐竟峰 2015-02-18 22:51:34
la source

noter ce

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

};

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

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>

peut appeler la fonction avec N'importe quel Args

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

ou

<body onmousemove="FollowMouse(d1)">
3
répondu ali.b.y 2017-01-04 05:38:49
la source

les arguments de fonction peuvent aussi être des tableaux:

function foo([a,b,c], d){
  console.log(a,b,c,d);
}

foo([1,2,3], 4)

bien-sûr, on peut aussi utiliser répandre :

function foo(a, b, c, d){
  console.log(a, b, c, d);
}

foo(...[1, 2, 3], 4)
1
répondu vsync 2018-08-15 11:22:37
la source

la réponse était déjà donnée, mais je veux juste donner mon morceau de gâteau. Ce que vous voulez atteindre est appelé method borrowing dans le contexte de JS, que lorsque nous prenons une méthode d'un objet et de l'appeler dans le contexte d'un autre objet. Il est assez courant de prendre des méthodes de tableau et de les appliquer aux arguments. Laissez-moi vous donner un exemple.

donc nous avons" super "fonction de hachage qui prend deux nombres comme argument et renvoie" super sûr " chaîne hachée:

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

hash(1,2); // "1,2" whoaa

jusqu'ici si bon, mais nous avons peu de problème avec l'approche ci-dessus, il est contraint, ne fonctionne avec deux nombres, qui n'est pas dynamique, faisons-le fonctionner avec n'importe quel nombre et de plus vous n'avez pas à passer un tableau (vous pouvez si vous insistez encore). Ok, Assez parlé, battons-nous!

la solution naturelle serait d'utiliser arr.join méthode:

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

hash(1,2,4,..); //  Error: arguments.join is not a function

Oh, mec. Malheureusement, cela ne marchera pas. Parce que nous appelons objet hash(arguments) et arguments est à la fois itérable et de type tableau, mais pas un vrai tableau. Comment se fait-dessous approche?

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

hash(1,2,3,4); // "1,2,3,4" whoaa

le tour est appelé method borrowing.

nous empruntons une méthode join à un tableau régulier [].join. et utilisons [].join.call pour l'exécuter dans le contexte de arguments .

pourquoi ça marche?

c'est parce Que l'interne algorithme de la méthode native arr.join(glue) est très simple.

tiré de la spécification presque "tel quel":

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.

donc, techniquement il prend ceci et joint ceci[0], ceci[1] ...etc. ensemble. Il est intentionnellement écrit d'une manière qui permet n'importe quel tableau-comme ceci (pas une coïncidence, beaucoup de méthodes suivent cette pratique). C'est pourquoi il fonctionne aussi avec this=arguments.

0
répondu Humoyun 2018-10-05 04:34:30
la source

1 - vous pouvez joindre le tableau dans une chaîne

2-le passer à la fonction

3-appel d'split

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

méthode d'appel:

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

ou même

myFunction("orange,Apple,fruits");
-6
répondu Hojjatollah Bakhtiyari Kiya 2016-02-02 09:19:53
la source

Autres questions sur javascript arrays function call