JavaScript String Templates

Synonymer:

  • Template Literals
  • Template Strings
  • String Templates
  • Back-Ticks Syntax

Back-Ticks Syntax

Template literalsAnvänd backtangent (``) istället för citationstecken ("") för att definiera strängar:

Exempel

let text = `Hello World!`;

Prova själv

citatstecken inom strängen

Genom att användaTemplate literals，du kan använda både enkel- och dubbelcitatstecken i strängen:

Exempel

let text = `He's often called "Johnny"`;

Prova själv

Flerradiga strängar

Template literalsTillåter flerradiga strängar:

Exempel

let text =
The quick
brown fox
hoppas över
the lazy dog`;

Prova själv

Interpolation

Template literalsBjuder på ett enkelt sätt att infoga variabler och uttryck i strängar.

Denna metod kallas string interpolation (string interpolation).

Syntax

${...}

Variabelersättning

Template literalsTillåter variabler inom strängar:

Exempel

let firstName = "Bill";
let lastName = "Gates";
let text = `Welcome ${firstName}, ${lastName}!`;

Prova själv

Automatisk ersättning av variabler med verkliga värden kallasString interpolation.

Uttryckserstatning

Template literalsTillåter uttryck inom strängar:

Exempel

let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;

Prova själv

Automatisk ersättning av uttryck med verkliga värden kallas string interpolation.

HTML-mall

Exempel

let header = "Templates Literals";
let tags = ["template literals", "javascript", "es6"];
let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
  html += `<li>${x}</li>`;
}
html += `</ul>`;

Prova själv

Webbläsarstöd

Internet Explorer stöder inteTemplate literals.

Den första webbläsarversionen som helt stöder template literals är:

Chrome IE Firefox Safari Opera
Chrome 41 Edge 13 Firefox 34 Safari 10 Opera 29
Mars 2015 November 2015 December 2014 September 2016 April 2015

Komplett strängreferens

För en fullständig referens, besök vår JavaScript-sträng-referenshandbok.

Denna handbok innehåller beskrivningar och exempel på alla strängattribut och metoder.