标签模板(tagged template)
为此，引出了标签模板的概念。标签模板则是在反引号前面引入一个标签（tag）。该标签是一个函数，用于处于定制化模板字符串后返回值。就拿上面对特殊字符串举例。
/**
* HTML 标签转义
* @param {Array.<DOMString>} templateData 字符串类型的tokens
* @param {...} ..vals 表达式占位符的运算结果tokens
*
*/
function SaferHTML(templateData) {
var s = templateData[0];
for (var i = 1; i < arguments.length; i++) {
var arg = String(arguments[i]);
// Escape special characters in the substitution.
s += arg.replace(/&/g, "&")
.replace(/</g, "<")
.replace(/>/g, ">");
// Don't escape special characters in the template.
s += templateData[i];
}
return s;
}
// 调用
var html = SaferHTML`<p>这是关于字符串模板的介绍</p>`;
标签函数会接收多个参数。
- 第一个参数是包含了字符串字面量(即那些没有变量替换的值)的数组
- 后面的参数是已经替换后的变量值
改一下例子1
var name = '丁香医生';
var desc = '丁香医生是面向大众的科普性健康类网站';
tag`公司名：${name}简介：${desc}`
tag 的参数则分别为 ['公司名：','简介：'], '丁香医生', '丁香医生是面向大众的科普性健康类网站'。
有了此类方法，就大大的增加了控制的权利。如上面说的国际化库甚至循环语句。
浏览器兼容性
- 服务器端， io.js 支持
- 浏览器端， FF34+ , chrome 41+
- 移动端 IOS 8, Android 4.4
- IE Tech Preview
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持黑区网络。