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}`);

Erweitern Sie das Snippet

— Darren Joy
quelle

Können Sie dem, wonach Sie fragen, einen Kontext geben? Diese Frage ist wie geschrieben unklar.

— Sam Hanley

3

ECMAScript 2015 Vorlagenliterale

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

192

Sie sprechen von Vorlagenliteralen .

Sie ermöglichen sowohl mehrzeilige Zeichenfolgen als auch Zeichenfolgeninterpolation.

Mehrzeilige Zeichenfolgen:

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

Erweitern Sie das Snippet

String-Interpolation:

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

Erweitern Sie das Snippet

— 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

Erweitern Sie das Snippet

— 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