آموزش رشته‌های تمپلیت در جاوا اسکریپت

شیوه‌ی نوشتاری بک تیک ها(Back-Tics)

رشته‌های تمپلیت(Template Strings) به جای علامت‌های نقل قول(" ") از بک‌تیک‌ها (``)استفاده می‌کنند:

let text = `Hello World!`;

استفاده از علامت‌های نقل قول در درون رشته‌ها

رشته‌های تمپلیت(Template Strings) به ما امکان می‌دهند تا از هردوی علامت‌های نقل قول تکی و دوتایی در درون یک رشته استفاده کنیم:

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

استفاده از رشته‌های چندخطی(Multiline Strings)

رشته‌های تمپلیت به ما امکان می‌دهند تا از رشته‌های چندخطی استفاده کنیم:

let text =
`The quick
brown fox
jumps over
the lazy dog`;

درون یابی در رشته‌های جاوا اسکریپت

رشته‌های تمپلیت به ما امکان می‌دهند تا از متغیرها در درون رشته‌ها استفاده کنیم، به این کار، درون‌یابی(interpolate) گفته می‌شود. رشته‌های تمپلیت، یک روش ساده برای انجام این کار ارائه می‌دهند. 

${...}

let firstName = "John";
let lastName = "Doe";

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

جایگزینی عبارت‌ها در جاوا اسکریپت(Expression Substitution)

رشته‌های تمپلیت به ما امکان می‌دهند تا در رشته‌ها، از درون‌یابی عبارت‌ها(interpolation of expressions) استفاده کنیم:

let price = 10;
let VAT = 0.25;

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

تمپلیت‌های HTML

let header = "Template Strings";
let tags = ["template strings", "javascript", "es6"];

let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
  html += `<li>${x}</li>`;
}

html += `</ul>`;

پشتیبانی مرورگرها

رشته‌های تمپلیت در اکما اسکریپت 6 یا ES6 تعریف شده اند. اکما اسکریپت 6 از ماه ژوئن 2017 در تمامی مرورگرهای مدرن پشتیبانی می‌شود:

Chrome 51	Edge 15	Firefox 54	Opera 38	Safari 10
May 2016	Apr 2017	Jun 2017	Jun 2016	Sep 2016

منبع: www.w3schools.com/js