JavaScript-Erkundung: eval() ist der „Teufel'

Wenn Sie eval() in Ihrem aktuellen Code verwenden, denken Sie an das Mantra „eval() ist der Teufel“. Diese Methode akzeptiert eine beliebige Zeichenfolge und verarbeitet sie als JavaScript-Code. Wenn der betreffende Code im Voraus bekannt ist (nicht zur Laufzeit bestimmt wird), gibt es keinen Grund, eval() zu verwenden. Wenn der Code zur Laufzeit dynamisch generiert wird, gibt es eine bessere Möglichkeit, dasselbe Ziel zu erreichen, ohne eval zu verwenden. Zum Beispiel wäre es besser und einfacher, die eckige Klammernotation zu verwenden, um auf dynamische Eigenschaften zuzugreifen:

// 反面示例
var property = "name";
alert(eval("obj." + property));
 
// 更好的
var property = "name";
alert(obj[property]);

Die Verwendung von eval() birgt auch Sicherheitsrisiken, da der ausgeführte Code (z. B. aus dem Netzwerk) möglicherweise manipuliert wurde. Dies ist eine sehr häufige negative Lektion beim Umgang mit JSON-Antworten von Ajax-Anfragen. In diesen Fällen ist es am besten, integrierte JavaScript-Methoden zum Parsen der JSON-Antwort zu verwenden, um Sicherheit und Effizienz zu gewährleisten. Wenn Ihr Browser JSON.parse() nicht unterstützt, können Sie die Bibliothek von JSON.org verwenden.

Es ist auch wichtig zu bedenken, dass die Übergabe von Zeichenfolgen an die Konstruktoren setInterval(), setTimeout() und Function() in den meisten Fällen der Verwendung von eval() ähnelt und daher vermieden werden sollte. Hinter den Kulissen muss JavaScript noch die Zeichenfolgen auswerten und ausführen, die Sie an das Programm übergeben:

// 反面示例
setTimeout("myFunc()", 1000);
setTimeout("myFunc(1, 2, 3)", 1000);
 
// 更好的
setTimeout(myFunc, 1000);
setTimeout(function () {
   myFunc(1, 2, 3);
}, 1000);

Die Verwendung des neuen Function()-Konstrukts ähnelt eval() und sollte mit Vorsicht angegangen werden. Dies kann ein mächtiges Konstrukt sein, wird aber oft missbraucht. Wenn Sie unbedingt eval() verwenden müssen, können Sie stattdessen die Verwendung von new Function() in Betracht ziehen. Es besteht ein kleiner potenzieller Vorteil, da die Codeauswertung in der neuen Function() im lokalen Funktionsbereich erfolgt, sodass alle durch var definierten Variablen, die im Code ausgewertet werden, nicht automatisch zu globalen Variablen werden. Eine andere Möglichkeit, automatische globale Variablen zu verhindern, besteht darin, den eval()-Aufruf in eine unmittelbare Funktion einzubinden.

Betrachten Sie das folgende Beispiel, bei dem nur un den Namespace als globale Variable verunreinigt.

console.log(typeof un);     // "undefined"
console.log(typeof deux);   // "undefined"
console.log(typeof trois);  // "undefined"
 
var jsstring = "var un = 1; console.log(un);";
eval(jsstring);             // logs "1"
 
jsstring = "var deux = 2; console.log(deux);";
new Function(jsstring)();   // logs "2"
 
jsstring = "var trois = 3; console.log(trois);";
(function () {
   eval(jsstring);
}()); // logs "3"
 
console.log(typeof un);     // number
console.log(typeof deux);   // "undefined"
console.log(typeof trois);  // "undefined"

Ein weiterer Unterschied zwischen eval() und Function-Konstrukten besteht darin, dass eval() in die Bereichskette eingreifen kann, während Function() sicherer ist. Unabhängig davon, wo Sie Function() ausführen, wird nur der globale Bereich angezeigt. Daher kann eine örtlich variable Verschmutzung wirksam vermieden werden. Im folgenden Beispiel kann eval() auf Variablen in seinem äußeren Bereich zugreifen und diese ändern, was Function nicht kann (beachten Sie, dass die Verwendung von Function und new Function identisch sind).

(function () {
   var local = 1;
   eval("local = 3; console.log(local)"); // logs "3"
   console.log(local); // logs "3"
}());
 
(function () {
   var local = 1;
   Function("console.log(typeof local);")(); // logs undefined
}());