javascript - ES6 标记的​​模板函数如何解释它们的参数顺序？

Question

考虑以下代码:

function f() {
  console.log(Array.from(arguments));
}

var x = 2;
var y = 3;
f`before ${x} ${y} after`;

f 的参数是 ( according to Traceur ):

["before ", " ", " after"], 2, 3

假设我想将所有文字字符串与替换值连接起来。
如何以正确的顺序执行此操作？

我是否需要将第一个数组中的“拆分点”与第一个之后的每个参数相匹配？

Answer 1

文字部分总是比替换多一个。第一个文字是模板的第一部分(如果以替换开头，则为空字符串)，最后一个文字是模板字符串的尾部(或者，如果以替换结尾，则为空字符串)。

要按顺序获取部件，请访问 literal[0]、sub[0]、literal[1]，... , sub[sub.length-1], literal[sub.length].

这是一个简单的起点:

function simpleTag(lit, ...sub) {
  return sub.reduce(
    // Add next substition and following literal
    (soFar, s, i) => soFar + s + lit[i+1],
    lit[0] // Start with the first literal
  );
}