ایجاد template در جاوااسکریپت (قسمت سوم)

ایجاد template در جاوااسکریپت یکی از امکانات جدید es6 سال 2015 می‌باشد. این نوع ساخت قالب دارای انواع حالت های مختلف به شرح زیر می‌باشد.

نام های دیگر آن:

Template Literals
Template Strings
String Templates
Back-Tics Syntax

هر یک از این روش ها را بهمراه مثال توضیح خواهم داد:

دستور بک تیک یا back tics

زمانی که بخواهیم از template استفاده کنیم به جای استفاده از جفت کوتیشن " " از دو بک تیک `` استفاده میکنیم.

مثال:

let text = `Hello amir javanmir!`;
document.getElementById(&quotdemo&quot) = text;
//Hello amir javanmir!

فایده این روش این است که شما میتوانید به راحتی از کاراکترهای " و ' به طور همزمان استفاده کنید.

مثال:

let text = `He's often called &quotamir javanmir&quot`;
document.getElementById(&quotdemo&quot) = text;
//He's often called &quotamir javanmir&quot

در این حالت میتوانیم درون رشته خود اینتر بزنیم و بدون مشکلی آن را در خروجی مشاهده کنیم. البته enter های زده شده در خروجی نمایش داده نمیشود.

مثال:

let text = `The quick
brown fox
jumps over
the lazy dog`;
document.getElementById(&quotdemo&quot) = text;
/*
The quick brown fox jumps over the lazy dog
*/

براحتی میتوان از متغیرها و عبارتهای محاسباتی درون بک تیک و template استفاده کرد. نام آن رشته تعاملی یا string interpolation است. برای نوشتن آن علامت $ قرار داده سپس آکلاد باز و بسته را قرار میدهیم و مقدار خود را درون آن مینویسیم. هر عبارت یا متغیر درون یک آکلاد قرار میگیرد.

نحوه نوشتن: