Ajout dynamique de code JavaScript avec eval

JavaScript dispose d'une fonction pour créer du code dynamiquement et ce code peut contenir des variables, des objets et des fonctions.
Il est placé dans une chaîne de caractères qui est donnée en argument à la fonction intégrée eval.

Eval peut s'utiliser avec JSON. Ce format est une alternative à XML plus simple dans sa définition et dans son utilisation. En effet une déclaration JSON peut devenir directement un objet JavaScript, dès lors qu'elle est donnée en argument à la fonction eval.

On peut utiliser eval pour ajouter du code au script en cours!

L'exemple le plus simple est l'évaluation d'une expression :

var x = 10;
alert( eval('(x + 2) * 5'));

Cliquer ici pour tester. Doit afficher 60.

Mais la force d'eval est dans la génération de code, par exemple ajouter un assignement...

var strvar = "var z = 5;";

function evalvar()
{
  eval(strvar);
  alert(z * 3);
}

Cliquer pour tester la variable. Doit afficher 15.

On peut même ajouter une fonction dynamiquement pour compléter le script en cours

On crée dynamiquement la fonction myfun() avec eval, et la fonction de test usefun() appelera cette fonction et affichera la valeur qu'elle retourne en fonction de l'argument qu'on lui passe.

var strfun = "function myfun(arg) { return arg * 3; }";

eval(strfun);

function usefun(x)
{
  var res = myfun(x);
  alert(res);
}

Cliquer pour tester la fonction. Doit afficher 36.

Un autre exemple avec des variables et une fonction:

<script>	
var doc = "var x=5;var y=6;function mult(a){return a * y;}";
eval(doc);  
document.write("x=" + x + "<br>");
document.write("y=" + y + "<br>");
document.write("mult(x)=" + mult(x) + "<br>");  
</script>

Ces possibilités sont bien sûr surtout intéressantes si le code ajouté ainsi est généré par programme en fonction de calculs et de nouveaux paramètres dans un traitement.

La fonction eval n'est pas le seul moyen d'augmenter le code du script en cours, on peut aussi générer un script et l'attacher au document avec les méthodes du DOM et l'éxécuter durant le traitement.

eval à une visibilité globale ou locale

Utilisée dans un contexte local, la fonction eval va créer des objets dont la portée est limitée au contexte. Pour leur donner une portée globale, il faut associer eval à la fenêtre:

window.eval(...)

ou avec une variable:

var gvar = this;
gvar.eval(...);

Les variables déclarées dans l'argument de eval seront alors globales.

Sécurité: Attention au code injecté

La fonction eval pourrait être utilisée pour exécuter du code malicieux sur les navigateurs des internautes. On doit donc prendre garde à vérifier les utilisations possible du code qui peut être généré dynamiquement.

Pour éliminer tout code indésirable, la RFC 4627 propose une expression régulière, cependant elle n'empêche pas de modifier les variables globales ou de session.

Mais en fait, le problème de sécurité ne se pose que si le contenu vient d'une source externe, par exemple d'un utilisateur par un champ d'entrée de texte.

Voir aussi

© 2007-2012 Xul.fr