写在前头:
很多时候,我们在用js拼接字符串的时候,用加号,如果习惯好一点,先把字符串写好,然后在要填充的地方打一对双引号,在弄两个加号,这样就可以放上变量了,虽然这拼接的东西越来越多,字符串变得越来越复杂,一眼看不出那些引号是怎么配对的.
为了解决这个问题,我在马桶上想了一坨屎的时间,我想到了printf,占位符是个不错的方式,貌似实现起来也不是很难,只要用正则和替换就可以了.

实现

function buildString(str,paraList){
  //占位符前后修饰符
  var prefix="#\\{", surfix="\\}";
  //正则表达式字符串
  var regStr = prefix + "([^"+ surfix +"]+)" + surfix;
  //新建正则表达式
  var regExp = new RegExp(regStr,"mg");
  if (!str){
    //没有参数时返回空字符串
    return "";
  }else if (str && arguments.length == 1){
    //只有一个参数时返回本身
    return str;
  }else if (arguments.length >= 2 && ((typeof paraList) == "string")){
        //字符串传参数时转换参数变成数组
   paraList = Array.prototype.splice.call(arguments,1);
   return bulidStr(str,paraList);
  }else{
  //数组或对象传参数
    return bulidStr(str,paraList);
  }
 //功能函数,替换并返回
 function bulidStr(str,paraList){
   var ret = str.replace(regExp,function(full,key){
     return paraList[key];
   });
   return ret;
 }
}

使用:

//使用对象传参,占位符使用属性名
var id="myID",myclass="myclass";
buildString("<div id='#{id}' class='#{myclass}' ></div>",{id:id,myclass:myclass});
//输出: "<div id='myID' class='myclass' ></div>"

//使用数组传参,占位符使用数组下标
var id="myID",myclass="myclass";
buildString("<div id='#{0}' class='#{1}' ></div>",[id,myclass]);
//输出: "<div id='myID' class='myclass' ></div>"

//使用字符串传参,占位符使用下标,字符串一次传入,位置从0开始
var id="myID",myclass="myclass";
buildString("<div id='#{0}' class='#{1}' ></div>",id,myclass);
//输出: "<div id='myID' class='myclass' ></div>"

注意

如果你在JSP里用这个方法,你最好换一个占位符前缀和后缀,应为jsp里#{}是有别的用处的,而{}也是需要转义的,还好选一个自己喜欢的符号并不是很难,你们就看着办吧~