自己实现stringFormat函数
stringFormat函数的使用示例：
var eleDiv = stringFormat('<div class="{0}">{1}</div>', 'ele', '我是一个div');
执行上面的代码后，eleDiv就变成了:
<div class="ele">我是一个div</div>
也就是说通过stringFormat可以对字符串进行格式化输出
自己实现的思路
- 因为我们无法预测到该函数会有多少个参数，最少一个（就是需要处理的字符串），因此在函数内需要通过arguments来获取变量
- 第一个参数string中包含有
"{0}、{1}..."这种类型的字符，表示的是它们将分别使用"第0个参数、第1个参数..."，因此在函数内我们需要获取到{}字符，并将其进行替换，所以需要使用正则表达式以及它的replace方法，以及正则的分组
代码如下：
function stringFormat(string) {
var data = [].slice.call(arguments, 1);
var regex = /{(\d+)}/g;
string = string.replace(regex, function(){
// 如果不知道输入的arguments参数是什么，可以打印出来
// console.log(arguments)
var index = arguments[1]; // arguments[1]获取到的是正则中分组的值
return data[index];
});
return string;
}
stringFormat('hi, {0}, {1}', 1,2,3,4,5,6)
自己实现模板引擎第一版
变量使用<%...%>表示
var Temperate = function (string, data){
var regex = /<%([^%]+)?%>/g;
var match ;
while(match = regex.exec(string)) {
string = string.replace(match[0], data[match[1]]);
}
return string;
}
var data = {
word: "hahaha",
woooorld: '1234'
};
var str = Temperate('hello <%word%> hhah <%woooorld%>', data)
console.log(str);
实现了上面的代码后，可以查看这篇文章进行深入了解——只有20行Javascript代码！手把手教你写一个页面模板引擎
