Heim > Artikel > Web-Frontend > JavaScript-Backticks: String-Interpolation oder getaggte Template-Funktion?
Backticks in JavaScript: Funktionsaufruf oder String-Tagging?
Bei der Verwendung von Backticks (...) in JavaScript kann es zu unerwartetem Verhalten kommen , beispielsweise beim Ausführen von console.log mit einem einzelnen Parameter innerhalb von Backticks:
console.log`1`;
Ausgabe erzeugen wie:
console.log`1` VM12380:2 ["1", raw: Array[1]]
Grundlegendes zu getaggten Vorlagen
Dieses Verhalten ergibt sich aus dem in ES6 eingeführten Konzept der getaggten Vorlagen. Mit Tags versehene Vorlagen sind Funktionen, die zusammen mit Backticks zum Bearbeiten von Zeichenfolgenliteralen verwendet werden können. Wenn eine getaggte Vorlage aufgerufen wird, erhält sie zwei Parameter:
Funktionsaufruf vs. Tagging
Im Fall von console.log mit Backticks, die Backticks rufen die Funktion nicht auf. Stattdessen markieren sie das String-Literal „1“ mit der Funktion console.log. Die resultierende getaggte Vorlagenfunktion gibt ein Array zurück, das den transformierten Wert enthält.
Im Einzelnen:
Transpilation
Moderne Browser transpilieren ES6-Code, um ihn mit älteren JavaScript-Versionen kompatibel zu machen. In diesem Fall wird die getaggte Vorlagenfunktion in einen regulären Funktionsaufruf transpiliert:
var _taggedTemplateLiteralLoose = function (strings, raw) { strings.raw = raw; return strings; }; console.log(_taggedTemplateLiteralLoose(["1"], ["1"]));
Die Funktion _taggedTemplateLiteralLoose gibt ein Array zurück, das an die Funktion console.log übergeben wird, die das Array druckt.
Fazit
Backticks in JavaScript können sowohl für die String-Interpolation als auch verwendet werden getaggte Vorlagen. Bei Verwendung mit einer getaggten Vorlagenfunktion empfängt die Funktion analysierte Werte der Zeichenfolgenliterale und eingebetteten Werte und ermöglicht so die Manipulation und Transformation von Daten vor der Ausgabe.
Das obige ist der detaillierte Inhalt vonJavaScript-Backticks: String-Interpolation oder getaggte Template-Funktion?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!