用数组替换模板中的字符串

debugcn 发表于 Dev

贝图斯

我有这个模板：

var temp = "<div class="${class}" id="loc" data-res="${res}"></div>";

并且我想用数组替换$ {res}，所以以后可以做类似的事情：

$('#loc').data('res');

我尝试了这个：

var res = [["a","b"],["c","d"]];
var arr = { class: "bold", res: res};
var newtemp = rep(temp, arr);

function rep(temp, arr) 
        {
            return temp.replace(/\$\{([\w]+)\}/g, function(s1, s2) { 
                var s = arr[s2]; 
                if (typeof (s) != "undefined"){ 
                    return s; 
                } else { 
                    return s1; } 
            });
        }

但是没有办法...对于$ {res}来说，保持格式像数组一样。我想要这个结果：

<div class="bold" id="loc" data-res='[["a","b"],["c","d"]]'></div>

阮阮

您可以检查变量s是否为数组，然后根据需要使用JSON.stringify()将该数组保持为字符串格式。

但是您的temp变量存在一些问题。它在双引号内包含双引号。在预期结果示例中，您同时使用双引号和单引号。因此，我建议将temp变量更改为：

var temp = `<div class="$class" id="loc" data-res='$res'></div>`;

并更改您正在使用的正则表达式。最终rep功能将是：

function rep(temp, arr) {
    return temp.replace(/\$([\w]+)/g, function (s1, s2) {
        var s = arr[s2];
        if (typeof (s) != "undefined") {
            return Array.isArray(s) ? JSON.stringify(s) : s;
        } else {
            return s1;
        }
    });
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。