如何推迟 ES6 模板文字的计算？

推迟执行 ES6 模板文字

ES6 模板文字为字符串插值提供了强大的语法糖，但是如果你想推迟评估怎么办直到动态元素创建之后？

问题

传统上，使用 String.prototype.format 将允许延迟评估。但是，模板文字是在解析时评估的，从而阻止了这种方法。

解决方案 1：使用标记模板文字

标记模板文字允许您拦截和处理模板求值之前的文字：

function formatter(literals, ...substitutions) {
    return {
        format: function() {
            // ... code here ...
        }
    };
}
console.log(formatter`Hello, <pre class="brush:php;toolbar:false">String.prototype.format = function() {
    var args = arguments;
    return this.replace(/$\{p(\d)\}/g, function(match, id) {
        return args[id];
    });
};
console.log("Hello, ${p0}. This is a ${p1}".format("world", "test"));

. This is a `.format("world", "test"));

解决方案 2：使用纯字符串文字

或者，您可以使用纯字符串文字并手动解析替换：

const welcome = (p0, p1) => `Hello, ${p0}. This is a ${p1}`;
console.log(welcome("world", "test"));

解决方案 3：避免模板文字并使用函数参数

最后，您可以完全避免模板文字并使用函数参数：

注意事项

• 解决方案 1 提供了最大的灵活性，但对于简单的用例来说可能过于复杂。
• 解决方案 2 更简单，但需要手动解析。
• 解决方案 3 使用传统方法，没有模板文字。

以上是如何推迟 ES6 模板文字的计算？的详细内容。更多信息请关注PHP中文网其他相关文章！