Question

我有一个像这样的对象

myObj = {
    "strPattern": "Name: #name#<br>Surname: #sname#<br>Location: #loc#",
    "name": "John",
    "sname": "Doe",
    "loc": "LA"
}

现在我需要一个函数来获取我的对象并在其模式的帮助下将其作为字符串返回。

预期结果："Name: John<br>Surname: Doe<br>Location: LA"

我无法使用JavaScript的替换方法，我不知道如何做到这一点。谢谢你的帮助。

顺便说一下，subStrs的数量可以是动态的。例如，在此示例中有3个子串，但对于其他对象，它可以是5或10。＃age＃，＃gender＃等...

Answer 1

您可以使用for (var key in myObj)结构循环到对象属性。在每个循环中，key变量保存每个属性的名称，您可以使用myObj[key]变量访问其值。

在您的场景中如何使用的示例可能是这样的。

var myObj = {
    "strPattern": "Name: #subStr1#<br>Surname: #subStr2#<br>Location: #subStr3#",
    "subStr1": "John",
    "subStr2": "Doe",
    "subStr3": "LA"
};

var html = myObj["strPattern"];

for (var key in myObj) {
   var obj = myObj[key];
    if(key !== "strPattern") {
        html = html.replace("#" + key + "#",obj);
    }
}

jQuery('#result').html(html);

我也用jsfiddle做了一个。

修改：正如@Andreas在评论中提到的那样，无法保证访问属性的顺序，我相应调整了我的代码段。

Answer 2

以下功能可用于改善表现。但是，如果您不需要多次使用该模板，则无用。

function compile(tpl) {
    tpl = tpl.split(/#(.*?)#/);
    return Function('return [' + tpl.map(function (v, i) {
        if (i % 2) return 'this["' + v + '"]';
        return v && '"' + v.replace(/"/g, '\\"') + '"';
    }).join(',') + '].join("");');
}

用法示例：

var myObj = {
    "strPattern": "Name: #name#<br>Surname: #sname#<br>Location: #loc#",
    "name": "John",
    "sname": "Doe",
    "loc": "LA"
};

myObj.strPattern = compile(myObj.strPattern).call(myObj);

更有趣：

var tpl = '#first# #last#',
    compiled = compile(tpl);

compiled.call({ first: 'John', last: 'Doe' }); // "John Doe"
compiled.call({ first: 'Walter', last: 'White' }); // "Walter White"

此处有更多详情：https://stackoverflow.com/a/20886377/1636522。

Answer 3

另一种解决方法是通过字符串中出现的替换来实现：

var Stringify = function(obj){
  return obj.strPattern.replace(/#([a-z]+)#/gi, function(match,group){
    return obj[group] || match;
  });
};

var str = Stringify({
  "strPattern": "Name: #name#<br>Surname: #sname#<br>Location: #loc#",
  "name": "John",
  "sname": "Doe",
  "loc": "LA"
});

对于那些想要使用string.replace(pattern, function)的人来说，这也是有意义的。

When did all browsers start supporting the String.replace(regexp, replacement_function)?

Answer 4

myObj = {
    "strPattern": "Name: #subStr1#<br>Surname: #subStr2#<br>Location: #subStr3#",
    "subStr1": "John",
    "subStr2": "Doe",
    "subStr3": "LA"
}
function patternMatcher(myObj){
  strp = myObj.strPattern;
  pattern = strp.match(/#(.*?)#/g);

  for (key in pattern){
    origKey = pattern[key].substr(1,pattern[key].length-2);
    strp =  strp.replace(pattern[key],myObj[origKey])
  }
return strp;
}

console.log(patternMatcher(myObj));

这是您的代码运行示例link

Answer 5

function getFilled(myObj){
  pattern = myObj.strPattern.match(/#(.*?)#/g);
  for (key in pattern){
    myObj.strPattern =  myObj.strPattern.replace(pattern[key],myObj[pattern[key].substr(1,pattern[key].length-2)])
  }
return myObj.strPattern;
}

console.log(getFilled(myObj));

Javascript模式替换

5 个答案: