我在字符串中有一个模板,我想用另一个字符串中的值替换一些占位符。对于我替换的每个占位符,我还想插入一个中断标记。
例如如果#ADDRESS2#
在模板中找到,我使用以下代码用字符串 val.address2
中的值替换它的所有出现.
template_html = template_html.replace(/#ADDRESS2#/g, '<br />'+ val.address_2);
但是有些情况下字符串 val.address2
是空的。在那种情况下,我不想插入中断标记。
所以我修改了我的代码如下
if( val.address_2.length > 0 ) {
template_html = template_html.replace(/#ADDRESS2#/g, '<br />'+ val.address_2);
} else {
template_html = template_html.replace(/#ADDRESS2#/g, '');
}
有没有更好的方法来编写上面的代码,因为我有多个占位符并且对于每个占位符我必须编写代码 2 次。
最佳答案
使用正则表达式替换,将函数传递给它。
该函数将获取替换键作为输入,并且根据是否有可用的替换键,它将插入一个空字符串,或者用换行符替换:
const template = "#foo# this bla bla #bar# but #baz# and stuff";
const replacements = {
foo: "test",
bar: "",
baz: "not empty"
};
const result = template.replace(/#([^#]+)#/g, (match, key) => {
// If there's a replacement for the key, return that replacement with a `<br />`. Otherwise, return a empty string.
return replacements[key] !== undefined
? "<br />" + replacements[key]
: "";
});
console.log("template:", template);
console.log("result:", result);
这里唯一的“陷阱”是模板字符串中的键必须与替换对象中的键匹配。不过,这不一定是坏事,因为如果您稍后回顾您的代码,它会稍微直观一些。
正则表达式可能看起来很吓人,但它真的很简单:
/#([^#]+)#/g
/
:正则表达式的开始,#
:字面意思是#
字符,(
:捕获组的开始,[^#]+
任何不是#
的字符。+
确保它匹配尽可能多的,)
:捕获组结束,#
:字面意思是#
字符,/g
:正则表达式结束。g
是全局标志,因此它不会在第一个结果处停止。
捕获组基本上告诉正则表达式对括号之间的所有内容进行分组。然后将这些组单独返回。
关于Javascript 替换 - 替换的动态值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57479381/