自定义模板的 Javascript 字符串替换器

Question

我想了解如何实现以下任务的一些想法。 我正在编写一种轻量级模板语言。它接受任何数组或 json 对象，并将字符串值替换为本地数据存储中的值。 请让我说明它是如何工作的:

var obj = {
  prop: "_p{propnameA}",
  secondprop: "_p{propnameB}",
  thirdprop: "Hello, this is \"_p{propnameC}\" and _p{propnameD},
  arr: [
    "textvalue", "propB value = _p{propB}"
  ]
}

我编写了一个算法，可以迭代每个 json 或数组的每个属性。现在我需要一种快速方法将所有模板标签替换为其实际值。 我想使用不同类型的模板标签:

• _p{...}
• _c{...}
• _v{...}

等等

每个模板标签在我的程序中都有不同的含义。例如:模板标签 _p{} 使用标签值的参数调用我的应用程序中的方法。 _p{propval}<​​/strong> 相当于 myApp.getProperty("propval")

其他标签调用我的应用程序的其他方法。 我正在考虑使用 string.replace 和我的标签的正则表达式。但我遇到了两个问题:

1. 如何编写这个正则表达式？
2. 如何处理非字符串返回值？

标签的计算值不一定是字符串。它也可以是更复杂的数据类型，例如数组或 json 对象。在本问题顶部的第一个示例代码中，“_p{propnameA}”的结果值可能是一个类似于 [1,2,3,4] 的数组。或者 _p{propnameB} 可以是一个数字，所以我上面的示例应该如下计算:

obj = {
  prop: [1, 2, 3, 4],
  secondprop: 827,
  thirdprop: "Hello, this is \"valueC\" and valueD",
  arr: ["textvalue", "propE value = 827"]
}

显然 obj.secondprop 不应该有字符串值“827”，而应该是数字，而 obj.arr[1] 应该是一个字符串。

您有什么聪明的想法来做到这一点吗？ 非常感谢您的帮助!

Answer 1

如果我理解正确的话，你正在寻找这样的东西:

// evaluate a single placeholder like _p{foo}

function evalPlaceholder(prefix, content) {

  switch(prefix) {
      case "_p": do_this();
      case "_c": do_that();      
      //etc
  }

}

// eval a string with placeholders

function evalTemplate(str) {

  var m = str.match(/^(_\w){([^{}]+)}$/);
  if(m) {
    // the whole string _is_ a placeholder
    return evalPlaceholder(m[1], m[2]);
  }
    
  // otherwise, the string can _contain_ placeholders
  return str.replace(/(_\w){(.+?)}/g, function(_, $1, $2) {
    return evalPlaceholder($1, $2);
  });

}

// walk an object recursively and eval all templates

function evalObject(obj) {
  
  Object.keys(obj).forEach(function(k) {
    var v = obj[k];
    
    if(typeof v == "object")
      evalObject(v)
    else
      obj[k] = evalTemplate(v);
    
  })

}