Question Variable JavaScript nombre d'arguments pour fonctionner


Existe-t-il un moyen d'autoriser les vars "illimités" pour une fonction en JavaScript?

Exemple:

load(var1, var2, var3, var4, var5, etc...)
load(var1)

439
2018-01-26 18:06


origine


Réponses:


Bien sûr, utilisez simplement le arguments objet.

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

691
2018-01-26 18:08



Une autre option consiste à transmettre vos arguments dans un objet de contexte.

function load(context)
{
    // do whatever with context.name, context.address, etc
}

et l'utilise comme ça

load({name:'Ken',address:'secret',unused:true})

Cela a l'avantage que vous pouvez ajouter autant d'arguments nommés que vous le souhaitez, et la fonction peut les utiliser (ou non) comme bon vous semble.


102
2018-01-26 18:34



Dans les navigateurs récents, vous pouvez accepter un nombre variable d'arguments avec cette syntaxe:

function my_log(...args) {
     //args is an Array
     console.log(args);
     //You can pass this array as parameters to another function
     console.log(...args);
}

70
2017-08-20 04:46



Je suis d'accord avec la réponse de Ken comme étant la plus dynamique et j'aime aller plus loin. Si c'est une fonction que vous appelez plusieurs fois avec des arguments différents - j'utilise la conception de Ken mais j'ajoute des valeurs par défaut:

function load(context) {

    var defaults = {
        parameter1: defaultValue1,
        parameter2: defaultValue2,
        ...
    };

    var context = extend(defaults, context);

    // do stuff
}

De cette façon, si vous avez beaucoup de paramètres mais n'avez pas nécessairement besoin de les définir à chaque appel de la fonction, vous pouvez simplement spécifier les paramètres par défaut. Pour la méthode extend, vous pouvez utiliser la méthode extend de jQuery ($.extend()), créez le vôtre ou utilisez ce qui suit:

function extend() {
    for (var i = 1; i < arguments.length; i++)
        for (var key in arguments[i])
            if (arguments[i].hasOwnProperty(key))
                arguments[0][key] = arguments[i][key];
    return arguments[0];
}

Cela va fusionner l'objet contexte avec les valeurs par défaut et remplir les valeurs non définies dans votre objet avec les valeurs par défaut.


45
2017-07-23 14:11



Oui, juste comme ceci:

function load()
{
  var var0 = arguments[0];
  var var1 = arguments[1];
}

load(1,2);

17
2018-01-26 18:08



Bien que je sois généralement d’avis que l’approche des arguments nommés est utile et flexible (à moins que l’ordre ne vous intéresse, les arguments les plus simples), le coût de l’approche mbeasley (utilisation des valeurs par défaut et étendues) me préoccupe. C'est un montant extrême de coût à prendre pour tirer des valeurs par défaut. Tout d'abord, les valeurs par défaut sont définies à l'intérieur de la fonction, de sorte qu'elles sont repeuplées à chaque appel. Deuxièmement, vous pouvez facilement lire les valeurs nommées et définir les valeurs par défaut en même temps en utilisant ||. Il n'est pas nécessaire de créer et de fusionner un autre nouvel objet pour obtenir cette information.

function load(context) {
   var parameter1 = context.parameter1 || defaultValue1,
       parameter2 = context.parameter2 || defaultValue2;

   // do stuff
}

C'est approximativement la même quantité de code (peut-être légèrement plus), mais devrait être une fraction du coût d'exécution.


8
2018-02-07 21:59



Comme déjà mentionné, vous pouvez utiliser le arguments objet pour récupérer un nombre variable de paramètres de fonction.

Si vous voulez appeler une autre fonction avec les mêmes arguments, utilisez apply. Vous pouvez même ajouter ou supprimer des arguments en convertissant arguments à un tableau. Par exemple, cette fonction insère du texte avant de se connecter à la console:

log() {
    let args = Array.prototype.slice.call(arguments);
    args = ['MyObjectName', this.id_].concat(args);
    console.log.apply(console, args);
}

8
2018-02-12 02:27



Il est préférable d'utiliser la syntaxe du paramètre de repos comme indiqué par Ramast.

function (a, b, ...args) {}

Je veux juste ajouter une belle propriété de l'argument ... args

  1. C'est un tableau, et non un objet comme les arguments. Cela vous permet d'appliquer des fonctions comme la carte ou le tri directement.
  2. Il n'inclut pas tous les paramètres mais seulement celui qui est passé à partir de celui-ci. Par exemple. function (a, b, ... args) dans ce cas args contient   argument 3 à arguments.length

8
2017-12-02 15:40



Utilisez le arguments objet lorsque dans la fonction d'avoir accès à tous les arguments transmis


5
2018-01-26 18:08



Alors que @roufamatic a utilisé le mot-clé arguments et que @Ken a montré un bon exemple d'utilisation, je ne pense pas que ce qui se passe dans cette instance soit vraiment perturbé et que les lecteurs ne soient pas explicitement déclarés. / method est destiné à prendre une quantité variable d'arguments / paramètres.

function varyArg () {
    return arguments[0] + arguments[1];
}

Lorsqu'un autre développeur examine votre code, il est très facile de supposer que cette fonction ne prend pas de paramètres. Surtout si ce développeur n'est pas au courant de la arguments mot-clé. Pour cette raison, il est conseillé de suivre une directive de style et d’être cohérent. Je vais utiliser Google pour tous les exemples.

Indiquons explicitement que la même fonction a des paramètres variables:

function varyArg (var_args) {
    return arguments[0] + arguments[1];
}

Paramètre d'objet VS var_args

Il peut y avoir des moments où un objet est nécessaire, car il s'agit de la seule méthode approuvée et considérée comme meilleure pratique d'une carte de données. Les tableaux associatifs sont mal vus et découragés.

SIDENOTE: Le mot-clé arguments retourne en réalité un objet en utilisant des nombres comme clé. L'héritage prototypal est aussi la famille d'objet. Voir fin de réponse pour une utilisation correcte du tableau dans JS

Dans ce cas, nous pouvons explicitement l'indiquer également. Remarque: cette convention de dénomination n’est pas fournie par Google mais constitue un exemple de déclaration explicite du type de paramètre. Ceci est important si vous cherchez à créer un modèle de saisie plus strict dans votre code.

function varyArg (args_obj) {
    return args_obj.name+" "+args_obj.weight;
}
varyArg({name: "Brian", weight: 150});

Lequel choisir?

Cela dépend des besoins de votre fonction et de votre programme. Si, par exemple, vous cherchiez simplement à renvoyer une base de valeur sur un processus itératif à travers tous les arguments passés, alors certainement arguments mot-clé. Si vous avez besoin de définir vos arguments et de mapper les données, la méthode objet est la voie à suivre. Regardons deux exemples et nous avons fini!

Arguments d'utilisation

function sumOfAll (var_args) {
    return arguments.reduce(function(a, b) {
        return a + b;
    }, 0);
}
sumOfAll(1,2,3); // returns 6

Utilisation de l'objet

function myObjArgs(args_obj) {
    // MAKE SURE ARGUMENT IS AN OBJECT OR ELSE RETURN
    if (typeof args_obj !== "object") {
        return "Arguments passed must be in object form!";
    }

    return "Hello "+args_obj.name+" I see you're "+args_obj.age+" years old.";
}
myObjArgs({name: "Brian", age: 31}); // returns 'Hello Brian I see you're 31 years old

Accéder à un tableau au lieu d'un objet ("... args" Le paramètre rest)

Comme mentionné en haut de la réponse le arguments Le mot-clé renvoie réellement un objet. Pour cette raison, toute méthode que vous souhaitez utiliser pour un tableau devra être appelée. Un exemple de ceci:

Array.prototype.map.call(arguments, function (val, idx, arr) {});

Pour éviter cela, utilisez le paramètre rest:

function varyArgArr (...var_args) {
    return var_args.sort();
}
varyArgArr(5,1,3); // returns 1, 3, 5

5
2018-02-24 03:47



Sachez que transmettre un objet avec des propriétés nommées comme suggéré par Ken ajoute le coût d’allocation et de libération de l’objet temporaire à chaque appel. Le passage d'arguments normaux par valeur ou référence sera généralement le plus efficace. Pour de nombreuses applications, la performance n'est pas critique, mais pour certaines, elle peut l'être.


2
2017-08-06 20:25