Literal Template JavaScript
Sinonim:
- Literal Template
- String Template
- Template String
- Sintaks Back-Tics
Sintaks Back-Tics
Literal Template menggunakan back-ticks (``) daripada tanda kutip ("") untuk mendefinisikan string:
Contoh
let text = `Hello World!`;
Kutipan Di Dalam String
Dengan template literals , Anda dapat menggunakan tanda kutip tunggal dan ganda di dalam string:
Contoh
let text = `He's often called "Johnny"`;
String Multiline
Literal template memungkinkan string multiline:
Contoh
let text =
`The quick
brown fox
jumps over
the lazy dog`;
Interpolasi
Literal template menyediakan cara mudah untuk menginterpolasi variabel dan ekspresi ke dalam string.
Metode ini disebut interpolasi string.
Sintaksnya adalah:
${...}
Substitusi Variabel
Literal templat memungkinkan variabel dalam string:
Contoh
let firstName = "John";
let lastName = "Doe";
let text = `Welcome ${firstName}, ${lastName}!`;
Penggantian otomatis variabel dengan nilai nyata disebut interpolasi string .
Substitusi Ekspresi
Literal template memungkinkan ekspresi dalam string:
Contoh
let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
Penggantian otomatis ekspresi dengan nilai nyata disebut interpolasi string .
Template HTML
Contoh
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>`;
Dukungan Peramban
Template Literalsadalah fitur ES6 (JavaScript 2015).
Ini didukung di semua browser modern:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
Template Literalstidak didukung di Internet Explorer.
Referensi String Lengkap
Untuk referensi String lengkap, buka:
Referensi String JavaScript Lengkap .
Referensi berisi deskripsi dan contoh semua properti dan metode string.