Question

我编写了一个函数，它应该用两个分隔符替换代码中的代码，它返回（字符串I＆＃39; m应用它是HTML-Object的.outerHTML）。

这类似于它在例如它中的使用方式。 Vue.js或Angular。

看起来像这样：

static elemSyntaxParse(elem) {
        let elem = _elem.outerHTML;
        if (elem.includes("{{") || elem.includes("}}")) {
            let out = "";
            if ((elem.match(/{{/g) || []).length === (elem.match(/}}/g) || []).length) {
                let occurs = elem.split("{{"),
                    key,
                    temp;

                for (let i = 1; i < occurs.length; i++) {
                    if (occurs[i].includes("}}")) {
                        key = occurs[i].substring(0, occurs[i].indexOf("}}"));
                        temp = eval(key) + occurs[i].substring(occurs[i].indexOf("}}") + 2);
                        out += temp;
                    } else {
                        ModularCore.err("Insert-Delimiters \"{{\" and \"}}\" do not match.");
                        break;
                        return elem;
                    }
                }
                return occurs[0] + out;
            } else {
                ModularCore.err("Insert-Delimiters \"{{\" and \"}}\" do not match.");
                return elem;
            }
        }
        return elem;
    }

（该函数在类的内部并引用一些外部函数。）

使用示例：

<body>
    <p id="test">{{ Test }}</p>
    <script>
        let Test = 27;
        document.getElementById("test").outerHTML = elemSyntaxParse(document.getElementById("test"));
    </script>
</body>

返回此字符串：

<p id="test">27</p>

它有效，但它相当丑陋，有点慢。

我怎么去清理一下呢？我对ES6开放。

PS：我现在＆＃34; eval（）是邪恶的＆＃34;但这是我的代码中唯一出现的情况（据我所知）在这种情况下是不可替换的。

谢谢！

Answer 1

我认为您可以省略一些检查并最终：

 const text = elem.outerHTML.split("{{");
 let result = text.shift();

 for(const part of text) {
   const [key, rest, overflow] = part.split("}}");
   if(!key || rest == undefined || overflow) {
     ModularCore.err("Insert-Delimiters \"{{\" and \"}}\" do not match.");
     return elem.outerHTML;
   }

   result += eval(key) + rest;
 }

 return result;

Answer 2

反转测试逻辑以摆脱嵌套和else子句

    if (! elem.includes("{{") || !elem.includes("}}")) {
       ModularCore.err("Insert-Delimiters \"{{\" and \"}}\" do not match.");
       return elem;
    }

    // original loop code here

请勿仔细检查 - @Bergi comment says。

测试表示“未找到等”的返回值

// if is removed. next line...
let occurs = elem.split("{{"), key, temp; 

// if the separator is not in the string, 
// it returns a one-element array with the original string in it. 

if(occurs[0] === elem) return "no substring found";

以上应该消除2个嵌套级别。然后，您可以在内部for循环中执行类似的操作。

简化复合逻辑。

!a || !b相当于!(a && b)。 This is De Morgan's law

低效/丑陋的替换功能

2 个答案: