Appeler une fonction JavaScript nommée dans une variable

Question

Je dispose d'une variable JavaScript qui contient le nom d'une fonction JavaScript. Cette fonction existe sur la page car elle a été chargée et placée en utilisant $.ajax, etc.

Quelqu'un peut-il me dire comment je pourrais appeler la fonction JavaScript nommée dans la variable, s'il vous plaît ?

Le nom de la fonction est dans une variable car l'URL utilisée pour charger le fragment de page (qui est inséré dans la page actuelle) contient le nom de la fonction à appeler.

Je suis ouvert à d'autres suggestions sur la façon de mettre en œuvre cette solution.

Answer 1

Je recommanderais d'éviter eval.

Pour résoudre ce problème, vous devez connaître ces choses sur JavaScript.

1. Les fonctions sont des objets de première classe, elles peuvent donc être des propriétés d'un objet (auquel cas elles sont appelées méthodes) ou même des éléments de tableaux.
2. Si vous ne choisissez pas l'objet auquel une fonction appartient, elle appartient à l'étendue globale. Dans le navigateur, cela signifie que vous la placez sur l'objet nommé "window", où résident les variables globales.
3. Les tableaux et les objets sont intimement liés. (La rumeur prétend qu'ils pourraient même être le résultat d'un inceste !) Vous pouvez souvent remplacer l'utilisation d'un point . plutôt que des crochets [], ou vice versa.

Votre problème résulte du fait de considérer la méthode de référence par point plutôt que la méthode de référence par crochets.

Alors, pourquoi pas quelque chose comme,

window["functionName"]();

Cela suppose que votre fonction réside dans l'espace global. Si vous avez mis en namespace, alors :

myNameSpace["functionName"]();

Évitez eval, et évitez de passer une chaîne de caractères à setTimeout et setInterval. J'écris beaucoup de JS, et je n'ai JAMAIS besoin de eval. "Avoir besoin" de eval vient du fait de ne pas connaître assez profondément le langage. Vous devez apprendre sur le contexte, le contexte d'exécution et la syntaxe. Si vous êtes bloqué avec un eval, demandez simplement--vous apprendrez rapidement.

Answer 2

Si c'est dans la portée globale, il vaut mieux utiliser :

function foo()
{
    alert('foo');
}

var a = 'foo';
window[a]();

que eval(). Parce que eval() c'est méchant.

Exactement comme l'a dit Nosredna 40 secondes avant moi, c'est >.<

Answer 3

Évitez absolument d'utiliser eval pour faire quelque chose comme cela, sinon vous vous exposerez à des vulnérabilités XSS (Cross-Site Scripting).

Par exemple, si vous utilisez les solutions eval proposées ici, un utilisateur malveillant pourrait envoyer un lien à sa victime qui ressemblerait à ceci :

[http://yoursite.com/foo.html?func=function()](http://yoursite.com/foo.html?func=function()){alert('Im%20In%20Teh%20Codez');}

Et leur javascript, pas le vôtre, serait exécuté. Ce code pourrait faire bien pire qu'afficher simplement une alerte; il pourrait voler des cookies, envoyer des requêtes à votre application, etc.

Assurez-vous donc de ne jamais utiliser eval pour du code non fiable provenant de l'entrée utilisateur (et tout ce qui se trouve dans la chaîne de requête est considéré comme une entrée utilisateur). Vous pouvez prendre l'entrée utilisateur comme une clé qui pointera vers votre fonction, mais assurez-vous de ne rien exécuter si la chaîne donnée ne correspond pas à une clé de votre objet. Par exemple :

// Mettre en place les fonctions possibles:
var myFuncs = {
  func1: function () { alert('Fonction 1'); },
  func2: function () { alert('Fonction 2'); },
  func3: function () { alert('Fonction 3'); },
  func4: function () { alert('Fonction 4'); },
  func5: function () { alert('Fonction 5'); }
};
// Exécuter celle spécifiée dans la variable 'funcToRun':
myFuncs[funcToRun]();

Cela échouera si la variable funcToRun ne pointe vers rien dans l'objet myFuncs, mais cela n'exécutera aucun code.

Answer 4

C'est un peu laid, mais c'est la première chose qui m'est venue à l'esprit. Cela devrait également vous permettre de passer des arguments :

eval('var myfunc = ' + variable);  myfunc(args, ...);

Si vous n'avez pas besoin de passer des arguments, cela pourrait être plus simple.

eval(variable + '();');

L'avertissement standard sur le code répétitif s'applique.