JavaScript Шаблонные литералы
Синонимы:
- Шаблонные литералы
- Шаблонные строки
- Строковые шаблоны
- Back-Tics синтаксис
Back-Tics синтаксис
В шаблонных литералах для определения строки используются back-ticks (``) (обратные галочки или кавычки), а не обычные кавычки (""):
Кавычки внутри строк
С помощью шаблонных литералов вы можете использовать как одинарные, так и двойные кавычки внутри строки:
Многострочные строки
Шаблонные литералы допускают использование многострочных строк:
Интерполяция
Шаблонные литералы предоставляют простой способ интерполировать переменные и выражения в строки.
Метод называется строковой интерполяцией.
Синтаксис:
${...}
Замены переменных
Шаблонные литералы разрешают переменные в строках:
Пример
let firstName = "John";
let lastName = "Doe";
let text = `Welcome ${firstName,}, ${firstName,}`;
Автоматическая замена переменных действительными значениями называется интерполяцией строк.
Замена выражения
Шаблонные литералы разрешают выражения в строках:
Пример
let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
Автоматическая замена выражений действительными значениями называется интерполяцией строк.
HTML Шаблоны
Пример
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>`;
Поддержка браузерами
Шаблонные литералы не поддерживаются в Internet Explorer.
Первые версии браузеров с полной поддержкой были:
Chrome 41 | Edge 13 | Firefox 34 | Safari 10 | Opera 29 |
Mar 2015 | Nov 2015 | Dec 2014 | Sep 2016 | Apr 2015 |
Полный справочник строк
Для получения полной справки перейдите на Полный справочник JavaScript строк на нашем сайте W3Schools на русском.
Справочник содержит описания и примеры всех свойств и методов строк.