打印模板文字中的箭头功能

Question

在名为“Car”的函数中，我添加了一个方法“beep”，带有可选的消息输入：

this.beep = function (message) { }

我想使用模板文字来记录函数内部：

console.log(this.name + ': ' + 'Beeeeep!' + (message ? ' ' + message : ''))

我写了以下内容，但输出显示了文字本身的内容：

console.log(`${this.name}: Beeeeep! ${ (message) => {
  if (message) return `${message}`;
    return ' ';
  }}`);

输出（对于this.name ='myCar'）：

myCar: Beeeeep! (message) => {
    if (message) return `${message}`;
    return '';
  }

为什么它记录文字的内容而不是透明呢？

---

*我想出了如何以更简单的方式编写它：

console.log(`${this.name}: Beeeeep! ${message || ''}`)

但是我仍然想要了解第一个代码中的错误。

Answer 1

发生这种情况是因为您将函数的主体和定义传递给模板文字的字符串。如果希望函数的结果显示在字符串中，则应该同时使用和调用该函数，除非它将作为包含该函数体的字符串传递。为此，您可以使用IIFE。

console.log(`${this.name}: Beeeeep! ${((message) => {
  if (message) return `${message}`;
  return ' ';
})()}`);

Answer 2

我相信这是因为你的实现只是定义了一个函数，所以模板文字打印了函数本身。

您想打印函数的输出，因此需要调用箭头函数。我已将您的功能更改为使用三元运算符，并且还使用IIFE调用该函数，以便根据需要打印其输出。

console.log(`${this.name}: Beeeeep!  ${((message) => message ? message : ' ')('Test')}`);