我是靠谱客的博主 典雅微笑,这篇文章主要介绍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字符串使用占位符轻松实现拼接内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(49)

评论列表共有 0 条评论

立即
投稿
返回
顶部