Heim  >  Artikel  >  Web-Frontend  >  JavaScript-Backticks: String-Interpolation oder getaggte Template-Funktion?

JavaScript-Backticks: String-Interpolation oder getaggte Template-Funktion?

Barbara Streisand
Barbara StreisandOriginal
2024-11-22 06:34:181006Durchsuche

JavaScript Backticks: String Interpolation or Tagged Template Function?

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:

  • Strings: Ein Array von String-Literalen
  • ...Werte: Ein Array von Werten, die in die String-Literale eingebettet sind

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:

  • strings[0] enthält das String-Literal: „1“
  • strings[ 1] ist undefiniert
  • values[0] enthält den eingebetteten Wert: 1
  • raw enthält den untransformierte String-Literale: ["1"]

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!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn