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岁