Javascript appelle dynamiquement la méthode objet à partir de la chaîne


94

Puis-je appeler dynamiquement une méthode objet ayant le nom de la méthode sous forme de chaîne? Je l'imaginerais comme ceci:

var FooClass = function() {
    this.smile = function() {};
}

var method = "smile";
var foo = new FooClass();

// I want to run smile on the foo instance.
foo.{mysterious code}(); // being executed as foo.smile();

Réponses:


212

si le nom de la propriété est stocké dans une variable, utilisez []

foo[method]();

1
ça ne fonctionne pas pour moi en utilisant une variable dans une fonction: const genericResolver = (table, action, values) => {return Auth.isAuthenticated () .then (() => {return eval (table) .findAll ()
stackdave

Si vous souhaitez exécuter une méthode à partir d'une autre méthode à l'intérieur d'une classe, utilisez ce ['methodName'] ().
schlingel

2
Obtenir cette horrible erreur Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'FooClass'quelqu'un d'autre?
Anand Rockzz

33

Les propriétés des objets sont accessibles via la notation de tableau:

var method = "smile";
foo[method](); // will execute the method "smile"

4

Lorsque nous appelons une fonction à l'intérieur d'un objet, nous devons fournir le nom de la fonction sous forme de chaîne.

var obj = {talk: function(){ console.log('Hi') }};

obj['talk'](); //prints "Hi"
obj[talk]()// Does not work

2
Il est toujours utile de fournir des commentaires avec votre code afin qu'il puisse être compris hors de son contexte.
Phil Cooper

Ajout d'un commentaire. Merci!
sn

3

La méthode peut être appelée avec eval eval("foo." + method + "()"); peut ne pas être un très bon moyen.


Utile dans mon cas où fooest { fields: [{ id: 1 }] }et methodest fields[0]?.id, mais j'ai dû supprimer ()de votre proposition de réponse
Rorrim

-1

Je voudrais laisser un exemple ici pour cela. Par exemple; Je souhaite appeler une méthode de vérification dynamique lors de la soumission du formulaire.

<form data-before-submit="MyObject.myMethod">
    <button type="submit">Submit</button>
</form>
$('form').on('submit', function(e){

    var beforeSubmit = $(this).attr('data-before-submit');

    if( beforeSubmit ){

       params = beforeSubmit.split(".");
       objectName = params[0];
       methodName = params[1];

       result = window[objectName][methodName]($(this));

       if( result !== true ){
           e.preventDefault();
       }

    }

});
var MyObject = {
    myMethod = function(form){
        console.log('worked');
        return true;
    }
};
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.