Was bedeutet $ {} (Dollarzeichen und geschweifte Klammern) in einer Zeichenfolge in Javascript?

160

Ich habe hier oder auf MDN nichts gesehen. Ich bin sicher, ich vermisse nur etwas. Muss es irgendwo eine Dokumentation dazu geben?

Funktionell sieht es so aus, als könnten Sie eine Variable in einer Zeichenfolge verschachteln, ohne den +Operator zu verketten . Ich suche nach Dokumentation zu dieser Funktion.

Beispiel:

var string = 'this is a string';

console.log(`Insert a string here: ${string}`);

Darren Joy
quelle
Können Sie dem, wonach Sie fragen, einen Kontext geben? Diese Frage ist wie geschrieben unklar.
Sam Hanley
5
Das ist keine schlechte Frage. Es ist eine neue Funktion, und ich kann sicher kein Duplikat auf SO finden, obwohl ein Beispiel dafür, was genau gesehen wurde, gut gewesen wäre.
@ squint - stimme zu, aber Beispielcode und Verweis auf die Quelle wären hilfreich gewesen.
RobG
Beispiel hinzugefügt. Referenz war eine Codierungsherausforderung, aber es war eine Selbstverständlichkeit, als ob es etwas wäre, das Sie gerade verwenden. Hatte nichts darauf gesehen und konnte auch nichts finden. (In den letzten Jahren musste ich hier nie nach einem Q fragen. SO scheint jetzt fast alles zu sein ...)
Darren Joy

Antworten:

192

Sie sprechen von Vorlagenliteralen .

Sie ermöglichen sowohl mehrzeilige Zeichenfolgen als auch Zeichenfolgeninterpolation.

Mehrzeilige Zeichenfolgen:

console.log(`foo
bar`);
// foo
// bar

String-Interpolation:

var foo = 'bar';
console.log(`Let's meet at the ${foo}`);
// Let's meet at the bar

Rick Runyon
quelle
67
Eine Sache, die mich lange Zeit verwirrt hat, ist, dass Vorlagenliterale anstelle eines einfachen Anführungszeichens (') den Backtick verwenden, der sich links von "1" auf der Tastatur befindet.
Sydney
19
Cool: Sie können sogar Code "injizieren":console.log(`Your array:\n ${arr.join('\n ')}`)
T4NK3R
5
Es ist seltsam, dass Template LiteralIE nicht unterstützt wird, oder es ist natürlich, dass IE coole Dinge nicht unterstützt. Lesen Sie mehr
Mohammad Musavi
12

Wie in einem Kommentar oben erwähnt, können Sie Ausdrücke in den Vorlagenzeichenfolgen / -literalen haben. Beispiel:

const one = 1;
const two = 2;
const result = `One add two is ${one + two}`;
console.log(result); // output: One add two is 3

Joel H.
quelle
Ist es richtig zu sagen, dass Vorlagenzeichenfolgen verwendet werden können, um Code in die Zeichenfolge einzufügen?
carloswm85
Sie injizieren Ausdrücke und Ausdrücke sind Code. Sie können keinen Code einfügen, jedoch nur JavaScript-Ausdrücke.
Joel H
Ich werde versuchen, genauer zu sein. Bei Verwendung von String-Literalen kann ich Ausdrücke wie obj.value INSIDE in jeden String mit der Notation $ {} einfügen . Richtig?
carloswm85
Ja, und Sie können es selbst in der Konsole ausprobieren, z. B.hey ${obj.name}
Joel H
0

Sie können implizite Typkonvertierungen auch mit Vorlagenliteralen durchführen. Beispiel:

let fruits = ["mango","orange","pineapple","papaya"];

console.log(`My favourite fruits are ${fruits}`);
// My favourite fruits are mango,orange,pineapple,papaya
Shalom David
quelle