26 Dynamische Codeauswertung: eval(), new Function() (fortgeschritten)

In diesem Kapitel befassen wir uns mit zwei Möglichkeiten der dynamischen Codeauswertung: eval() und new Function().

26.1 eval()

Gegeben eine Zeichenkette str mit JavaScript-Code, wertet eval(str) diesen Code aus und gibt das Ergebnis zurück.

> eval('2 ** 4')
16

Es gibt zwei Möglichkeiten, eval() aufzurufen:

• Direkt, über einen Funktionsaufruf. Dann wird der Code im Argument im aktuellen Gültigkeitsbereich ausgewertet.
• Indirekt, nicht über einen Funktionsaufruf. Dann wird sein Code im globalen Gültigkeitsbereich ausgewertet.

„Nicht über einen Funktionsaufruf“ bedeutet „alles, was anders aussieht als eval(···)“.

• eval.call(undefined, '···') (verwendet die Methode .call() von Funktionen)
• eval?.() () (verwendet optionales Chaining)
• (0, eval)('···') (verwendet den Komma-Operator)
• globalThis.eval('···')
• const e = eval; e('···')
• Usw.

Der folgende Code veranschaulicht den Unterschied.

globalThis.myVariable = 'global';
function func() {
  const myVariable = 'local';
  
  // Direct eval
  assert.equal(eval('myVariable'), 'local');
  
  // Indirect eval
  assert.equal(eval.call(undefined, 'myVariable'), 'global');
}

Die Auswertung von Code im globalen Kontext ist sicherer, da der Code Zugriff auf weniger Interna hat.

26.2 new Function()

new Function() erstellt ein Funktions-Objekt und wird wie folgt aufgerufen:

const func = new Function('«param_1»', ···, '«param_n»', '«func_body»');

Die vorherige Anweisung ist äquivalent zur nächsten Anweisung. Beachten Sie, dass «param_1» usw. nicht mehr innerhalb von Zeichenkettenliteralen stehen.

const func = function («param_1», ···, «param_n») {
  «func_body»
};

Im nächsten Beispiel erstellen wir dieselbe Funktion zweimal, zuerst über new Function(), dann über einen Funktionsausdruck.

const times1 = new Function('a', 'b', 'return a * b');
const times2 = function (a, b) { return a * b };

26.3 Empfehlungen

Vermeiden Sie die dynamische Auswertung von Code so weit wie möglich.

• Es stellt ein Sicherheitsrisiko dar, da es einem Angreifer ermöglichen kann, beliebigen Code mit den Berechtigungen Ihres Codes auszuführen.
• Es kann ausgeschaltet werden – zum Beispiel in Browsern über eine Content Security Policy.

Sehr oft ist JavaScript dynamisch genug, sodass Sie eval() oder Ähnliches nicht benötigen. Im folgenden Beispiel kann das, was wir mit eval() tun (Zeile A), genauso gut ohne es erreicht werden (Zeile B).

const obj = {a: 1, b: 2};
const propKey = 'b';

assert.equal(eval('obj.' + propKey), 2); // (A)
assert.equal(obj[propKey], 2); // (B)

Wenn Sie Code dynamisch auswerten müssen:

• Bevorzugen Sie new Function() gegenüber eval(): Es führt seinen Code immer im globalen Kontext aus und eine Funktion bietet eine saubere Schnittstelle zum ausgewerteten Code.
• Bevorzugen Sie indirektes eval gegenüber direktem eval: Die Auswertung von Code im globalen Kontext ist sicherer.