ES6调用函数与模板文字但没有括号

Question

根据MDN,Tagged模板文字可以使用如下:

var a = 5;
var b = 10;
function tag(strings, ...values) {
  alert(strings[0]); // "Hello "
  alert(strings[1]); // " world "
  alert(values[0]); // 15
  alert(values[1]); // 50
  return "Bazinga!";
}
tag `Hello ${ a + b } world ${ a * b }`; // "Bazinga!"

在上面的示例中,tag不使用括号调用该函数.

我希望它应该被调用tag(`Hello`),但是它将模板文字产生的字符串作为函数参数的strings参数传递.

调用没有括号但带参数的函数的特殊功能是什么？

Answer 1

没有括号调用函数的这个特殊功能是什么？

语法允许这种标记模板的语法:

MemberExpression : MemberExpression TemplateLiteral
CallExpression : CallExpression TemplateLiteral

这些规则意味着a MemberExpression或a CallExpression后面TemplateLiteral被认为是函数调用.该规范的附加说明:

标记模板是一个函数调用,其中调用的参数是从TemplateLiteral(12.2.9)派生的.实际参数包括模板对象(12.2.9.3)以及通过计算嵌入在TemplateLiteral中的表达式生成的值.

如果你问为什么这样做,我不能给你答案.

但是,如果你考虑一下,就不能只使用"普通"函数调用语法.tag(`...`)表示tag传递单个参数,即评估模板文字的结果.但正如您在MDN的示例中所看到的,标记模板函数实际上传递了多个参数.如果函数以不同的方式(内部)调用,如果它们被传递给模板文字而不是被调用不同的值,那肯定会更令人惊讶.然后,如果你真的想要将模板文字传递给它,如何调用函数？

因此,引入新语法似乎是有道理的.

FWIW,这是"普通"函数调用的语法:

CallExpression : MemberExpression Arguments
CallExpression : CallExpression Arguments