JavaScript Литералы шаблона
Синонимы:
- Литералы шаблонов
- Шаблоны строк
- Строка шаблонов
- Синтаксис обратных ссылок
Синтаксис Back-Tics
Литералы шаблона для определения строки используйте обратные знаки back-ticks (``), а не кавычки (""):
Кавычки внутри строк
С литералами шаблона, вы можете использовать как одинарные, так и двойные кавычки внутри строки:
Многострочные строки
Литералы шаблона допускают многострочные строки:
Интерполяция
Литералы шаблонов обеспечивают простой способ интерполяции переменных и выражений в строки.
Этот метод называется интерполяцией строк.
Синтаксис таков:
${...}
Замена переменных
Литералы шаблона замена переменных в строки:
Пример
let firstName = "Щипунов";
let lastName = "Андрей";
let text = `Добро пожаловать, ${firstName} ${lastName}!`;
Попробуйте сами »
Автоматическая замена переменных реальными значениями называется интерполяцией строк.
Замена выражений
Литералы шаблона замена выражений в строки:
Пример
let price = 10;
let VAT = 0.25;
let total = `Итого: ${(price * (1 + VAT)).toFixed(2)}`;
Попробуйте сами »
Автоматическая замена выражений реальными значениями называется интерполяцией строк.
HTML Шаблоны
Пример
let header = "Литералы шаблонов";
let tags = ["литералы шаблонов", "javascript", "es6"];
let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
html += `<li>${x}</li>`;
}
html += `</ul>`;
Попробуйте сами »
Поддержка браузера
Метод Литералы шаблонов это функция ES6 (JavaScript 2015).
Он поддерживается во всех современных браузерах:
| Chrome | Edge | Firefox | Safari | Opera |
| Да | Да | Да | Да | Да |
Литералы шаблонов не поддерживается в Internet Explorer.
Полный справочник по строкам
Для получения полного справочника по строкам перейдите по ссылке:
Справочник содержит описания и примеры всех строковых свойств и методов.
