نماذج النصوص في JavaScript

المرادفات:

  • Template Literals
  • Strings Templates
  • نماذج النصوص
  • نحو العلامات العكسية

نحو العلامات العكسية

النصوص النمطيةاستخدام العلامات العكسية (``) بدلاً من الأقواس المزدوجة ("") لتحديد النصوص:

مثال

let text = `Hello World!`;

جرب بنفسك

الأقواس المزدوجة والمرتبطة داخل النص

من خلال استخدامالنصوص النمطية، يمكنك استخدام الأقواس المزدوجة والمرتبطة في نفس النص:

مثال

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

جرب بنفسك

النصوص المتعددة الأسطر

النصوص النمطيةيُسمح بالنصوص المتعددة الأسطر:

مثال

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

جرب بنفسك

التبديل

النصوص النمطيةيقدم طريقة بسيطة لدمج المتغيرات والتعبيرات داخل النصوص.

يُسمى هذا الطريقة بتحويل النصوص (string interpolation).

النحو

${...}

استبدال المتغيرات

النصوص النمطيةيُسمح بالمتغيرات داخل النصوص:

مثال

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

جرب بنفسك

استبدال المتغيرات بالقيم الحقيقية يُسمى بـتحويل النصوص.

استبدال التعبيرات

النصوص النمطيةيُسمح بالتعبيرات داخل النصوص:

مثال

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>`;
للمعرفة x من tags) {
  html += `<li>${x}</li>`;
}
html += `</ul>`;

جرب بنفسك

دعم المتصفح

Internet Explorer لا يدعمالنصوص النمطية.

أول إصدار من المتصفح يدعم النصوص النمطية الكاملة هو:

Chrome IE Firefox Safari Opera
Chrome 41 Edge 13 Firefox 34 Safari 10 Opera 29
مارس 2015 نوفمبر 2015 ديسمبر 2014 سبتمبر 2016 أبريل 2015

مرجع النصوص الكامل

للحصول على مرجع كامل، يرجى زيارة دليل مرجع JavaScript النصوص.

هذا الدليل يحتوي على وصف جميع خصائص النصوص وأساليب النصوص و الأمثلة.