JS字符串使用占位符轻松实现拼接

在JavaScript中，我们常常会有这样的需求，异步加载数据，并以元素追加的方式追加到页面中。

在拿到后台数据后，需要手动替换元素中的动态内容并拼接元素节点，写起来不仅麻烦，而且可读性非常差。

因此，我们可以自己来实现占位符替换功能。

核心代码

//var str = "js实现用{two}自符串替换占位符{two} {three}
{one} ".format({one: "I",two: "LOVE",three: "YOU"});
//var str2 = "js实现用{1}自符串替换占位符{1} {2}
{0} ".format("I","LOVE","YOU");
String.prototype.format = function() {
if(arguments.length == 0) return this;
var param = arguments[0];
var s = this;
if(typeof(param) == 'object') {
for(var key in param)
s = s.replace(new RegExp("\{" + key + "\}", "g"), param[key]);
return s;
} else {
for(var i = 0; i < arguments.length; i++)
s = s.replace(new RegExp("\{" + i + "\}", "g"), arguments[i]);
return s;
}
}

var str1 = "hello {0}".format("world"); //log
hello world
var str1 = "我叫{0},性别{1}".format("美男子", "男"); //log 我叫美男子,性别男
var user = {name: "美男子",sex: "男",age: 20};
var str2 = "我叫{name},性别{sex},今年{age}岁".format(user); //我叫美男子,性别男,今年20岁

最后

以上就是典雅微笑为你收集整理的JS字符串使用占位符轻松实现拼接的全部内容，希望文章能够帮你解决JS字符串使用占位符轻松实现拼接所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。