JavaScript-merkkijonomallit

Synonyymit:

  • Mallimerkkijonot
  • Mallimerkkijonot
  • Merkkijonomallit
  • Takaisinviiva-syntaksi

Takaisinviiva-syntaksi

Malli-ominaisuudetKäytä takaisinviivaa (``) eikä lainausmerkkejä ("") määrittääksesi merkkijonon:

Esimerkki

let text = `Hello World!`;

Kokeile itse

merkkijonojen sisäisiä lainausmerkkejä

KäyttämälläMalli-ominaisuudet,voit käyttää sekä yksinkertaisia että kaksoislyijyjä merkkijonossa:

Esimerkki

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

Kokeile itse

Useiden rivien merkkijono

Malli-ominaisuudetSallitaan useita rivejä merkkijonona:

Esimerkki

let text =
The quick
ruskea pöllö
hyppää yli
the lazy dog`;

Kokeile itse

Interpolointi

Malli-ominaisuudetTarjoaa yksinkertaisen tavan lisätä muuttujia ja lausekkeita merkkijonoon.

Tämä menetelmä kutsutaan merkkijonon interpolointina (string interpolation).

Syntaksi

${...}

Muuttujan korvaus

Malli-ominaisuudetSallitaan muuttujat merkkijonossa:

Esimerkki

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

Kokeile itse

Todenarvojen automaattinen korvaaminen muuttujilla kutsutaanMerkkijonon interpolointi.

Lausekkeen korvaus

Malli-ominaisuudetSallitaan lausekkeet merkkijonossa:

Esimerkki

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

Kokeile itse

Todenarvojen automaattinen korvaaminen lausekkeilla kutsutaan merkkijonon interpolointina.

HTML-mallit

Esimerkki

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

Kokeile itse

Selaimen tuki

Internet Explorer ei tueMalli-ominaisuudet.

Ensimmäinen täysin tukeva malli-ominaisuuksien selainversio on:

Chrome IE Firefox Safari Opera
Chrome 41 Edge 13 Firefox 34 Safari 10 Opera 29
2015 vuoden 3 kuukausi 2015 vuoden 11 kuukausi 2014 vuoden 12 kuukausi 2016 vuoden 9 kuukausi 2015 vuoden 4 kuukausi

Täydellinen merkkijonoreferenssi

Täydellinen referenssi löytyy vierailemalla JavaScript-merkkijonon referenssikirja.

Tämä oppikirja sisältää kaikkien merkkijonon ominaisuuksien ja metodioiden kuvaukset ja esimerkit.