js es6 标签模板还原字符串
前言
模板字符串的功能,它可以紧跟在一个函数名后面,该函数将被调用来处理这个模板字符串。这被称为“标签模板”功能(tagged template)。
举个栗子:
function tag(stringArr,value1,value2)
{
console.log(stringArr);
console.log(value1);
console.log(value2);
}
tag`hello hong${"你好"}word${5}`
第一个参数是数组,使用变量进行切割。
后面是变量的值。
那么其切割的规则是什么呢?如何还原字符串呢?请看正文。
正文
分两种情况:
第一种情况:
A B C D E
A C是我们输入的,其他类推哈。
这个是因为E是“”,string数组中最后一个一定是“”。
回到原题:A、C是我们的自己输入的,那么B、D就是用户输入的,看下面一个函数:
为什么统一这样写?,因为${}不确定是多少,所以去用argument去代替,比如说argument【1】,argument【2】以此类推。
那么A就是 StrAtrr[0],B就是Arg[1],C就是StrAtrr[1],D就是Arg[2],E就是Arg[2]
如果是这种情况就好办了,只要把A拿出来,后面就是Arg[1]+StrAtrr[1]+Arg[2]+Arg[2],
是不是很有顺序?直接看代码吧。
function restore(strAttr) {
let output = strAttr[0];
for (let i = 1; i < arguments.length; i++) {
let arg = String(arguments[i]);
output += arg;
output += strAttr[i];
}
return output;
}
console.log(restore `你好${"朋友"}感谢你${"给与建议"}`);
输出结果:
第二种情况
A、B、C、D、E这时候就是A、C是${},而B、D、E是原有格式字符串。
同样如此:
A为arg[1],B为strattr[0],C为arg[2],D为strattr[1],E为strattr[2]
很有规律arg[1]下一个就是strattr[0],减了一,而E为“”,我们不必要去管。
所以代码如下:
function restore(strAttr) {
let output = "";
for (let i = 1; i < arguments.length; i++) {
let arg = String(arguments[i]);
output += arg;
output += strAttr[i - 0];
}
return output;
}
console.log(restore `${"朋友"}感谢你${"给与建议"}谢谢`);
把两个函数合并一下,用bool类型做判断即可。