推迟执行ES6模板文字

小编典典

推迟执行ES6模板文字

javascript

我正在使用新的ES6模板文字功能，想到的第一件事是String.formatJavaScript，因此我着手实现了一个原型：

String.prototype.format = function() {
  var self = this;
  arguments.forEach(function(val,idx) {
    self["p"+idx] = val;
  });
  return this.toString();
};
console.log(`Hello, ${p0}. This is a ${p1}`.format("world", "test"));

但是，在将模板文字传递给我的原型方法之前，需要先对其进行评估。有什么方法可以编写上述代码以将结果推迟到动态创建元素之后？

阅读 271

2020-04-25

共1个答案

小编典典

我可以看到三种解决方法：

使用模板字符串，就像设计使用的那样，没有任何format功能：
```
console.log(`Hello, ${"world"}. This is a ${"test"}`);
```
// might make more sense with variables:
var p0 = “world”, p1 = “test”;
console.log(Hello, ${p0}. This is a ${p1});

甚至实际推迟评估的 功能参数 ：

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

不要使用模板字符串，而应使用纯字符串文字：
```
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”));
使用带标签的模板文字。请注意，替换仍将在不被处理程序拦截的情况下进行求值，因此您不能像p0没有变量so 那样使用标识符。 ~~如果接受了不同的 替换主体语法 建议，则此行为可能会更改（更新：否）。~~

function formatter(literals, ...substitutions) {
return {
    format: function() {
        var out = [];
        for(var i=0, k=0; i < literals.length; i++) {
            out[k++] = literals[i];
            out[k++] = arguments[substitutions[i]];
        }
        out[k] = literals[i];
        return out.join("");
    }
};
}
console.log(formatter`Hello, ${0}. This is a ${1}`.format("world", "test"));
// Notice the number literals: ^     
          ^

2020-04-25