javascript - 为什么使用模板字符串时可以不用括号调用函数?

标签 javascript ecmascript-harmony template-strings ecmascript-6

我有一个简单的日志功能:

function log(str) {
  console.log('logged: ', str);
}

如果我不带括号调用它(当前使用 Chrome 的开发工具)并传入模板字符串,如下所示:

log`foo`

输出为:logged: ["foo", raw: Array[1]]

如果我用括号调用它,

log(`foo`)

输出为:logged: foo

为什么在 Javascript 中可以使用模板字符串调用函数而不使用括号?发生了什么导致结果与用括号调用它不同?

最佳答案

第一个示例 ( log`foo` ) 允许语言规范确定传递给日志函数的值(请参阅 12.3.7 )。第二个示例 ( log(`foo`) ) 显式传递单个参数。

模板文字可以包含字符串以及表达式。有时您可能希望对字符串的字符串部分和表达式部分的编译有更多的控制。在这种情况下,您可能正在寻找带标记的模板。

var name = "Jonathan";
var mssg = foo `Hello, ${name}. Nice name, ${name}.`;

function foo ( strings, ...values ) {
    console.log( strings ); //["Hello, ", ". Nice name, ", ".", raw: Array[3]]
    console.log( values  ); //["Jonathan", "Jonathan"]
}

请注意这里所有字符串是如何通过第一个参数传入的。同样,所有插值表达式都通过其余参数传入(此处合并到一个数组中)。

有了这个附加的控制,我们可以做各种各样的事情,比如本地化。在此示例中,语言规范确定传递给函数的适当值 - 开发人员无法确定这一点。

相比之下,当您调用log(<code>foo</code>)时,您最终只能得到结果字符串。没有对象,没有零件,没有原始值。

关于javascript - 为什么使用模板字符串时可以不用括号调用函数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33660518/

相关文章:

javascript - 你如何将 Prop 传递给所有反应路线? (动态更改标题)

javascript - ThreeJS 对象组中的面部未收到阴影

javascript - 未捕获的类型错误 : Cannot read property 'getProxy' of undefined

javascript - 如何根据路由更改快速静态路径?

javascript - 如何在 ES5/严格模式下启用正确的尾部调用?

javascript - 如何测试harmony/ES6/ECMAScript 6 JavaScript?

javascript - 如何检查/迭代 Node 中的对象?

javascript - ES6 模板字符串测试平台

javascript - 如何更改模板字符串推断的值

javascript - ES2015 模板字符串未解析