نماذج النصوص في 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>`;
for (const x of 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 年 3 月 2015 年 11 月 2014 年 12 月 2016 年 9 月 2015 年 4 月

完整的字符串参考

如需完整参考，请访问我们的完整 JavaScript 字符串参考手册。

该手册包含所有字符串属性和方法的描述和实例。