Vorlagenliterale: Wiederbelebung der Wiederverwendung

Vorlagenliterale in ES6 werden oft als leistungsstarke Textmanipulationswerkzeuge angepriesen, aber es bleibt eine quälende Frage bestehen: Können sie wirklich wiederverwendet werden?

Unerfüllbare Erwartungen

Auf den ersten Blick scheinen Vorlagenliterale dynamische Ersetzungen nur zum Zeitpunkt der Deklaration zu versprechen. Dies wirft die Frage auf: Was ist eine Vorlage, die statisch bleibt?

Den Kreislauf durchbrechen

Entgegen der landläufigen Meinung können Vorlagenliterale durch Laufzeitersetzungen mithilfe der Funktion neu belebt werden Konstruktor als Vermittler:

const template = "Hello ${this.name}!";
const variables = {
  name: "world"
};
function fillTemplate(str, data) {
  return new Function("return `"   str   "`;").call(data);
}
console.log(fillTemplate(template, variables)); // Output: Hello world!

Anatomie einer wiederverwendbaren Vorlage

Diese Technik ermöglicht Folgendes:

• Laufzeit Interpolation: Variablen werden dynamisch ausgefüllt, wie in herkömmlichen Template-Engines.
• Fragmentierung: Vorlagen können in separaten Dateien gespeichert oder dynamisch abgerufen werden.
• Dynamische Erstellung: Vorlagen können im Handumdrehen erstellt und ausgewertet werden.

Adressierungsvorbehalte

Diese Methode bietet zwar wiederbelebte Funktionalität, es gibt aber einige Vorbehalte:

• Eingeschränktes JavaScript: Inline-JavaScript-Logik ist aufgrund später Interpolation nicht möglich.
• Vorlagen-Tags: Vorlagen-Tags werden zu einer Herausforderung zu implementieren.

Trotz dieser Einschränkungen ist es klar, dass Vorlagenliterale mit ein wenig Einfallsreichtum ihre herkömmlichen Grenzen überschreiten und wirklich wiederverwendbar werden können.