Объединены ли родственные замены в помеченных шаблонах?

Question

Примите во внимание следующее:

String.raw`Test ${123}${'abc'}`;
String.raw`Test ${123 + 'abc'}`;

Является ${123}${'abc'} эквивалентно ${123 + 'abc'}? Другими словами, преобразованы ли братья и сестры в ${123 + 'abc'} закулисный формат?

Кроме того, как кто-то будет обрабатывать этот конкретный случай в своей функции тегированного шаблона?

Answer 1

С String.rawповедение по сути то же самое. И это и + (со строковым значением) выполнить конкатенацию, получив тот же результат.

---

Разница между ними заключается в том, что 1-я строка откладывает объединение для String.raw выполнять с ${123} а также ${'abc'} предоставлены ему в качестве отдельных аргументов.

В использовании +конкатенация всегда выполняется заранее, передавая только одно значение String.raw за ${123 + 'abc'},

function foo(template, ...values) {
  console.log(template, values);
}

foo`Test ${123}${'abc'}`; // [ 'Test ', '', '' ] [ 123, 'abc' ]
foo`Test ${123 + 'abc'}`; // [ 'Test ', '' ]     [ '123abc' ]

С другими помеченными функциями различие может быть более очевидным, так как функция может выполнять другие операции до (или помимо) объединения.

Придуманный пример:

// adds 99999 to each value
function bar(template, ...values) {
  var raw = template.raw;
  var result = raw[0];

  values.forEach((value, i) => {
     result += value + 99999;
     result += raw[i + 1];
  });

  return result;
}

console.log(bar`Test ${123}${'abc'}`); // 100122abc9999
console.log(bar`Test ${123 + 'abc'}`); // 123abc99999