Javascript 带括号而不是大括号的箭头函数语法？

我在React教程中看到了一段代码片段：

const App = ({title}) => (
  <div className="header">{title}</div>
);

const-App=（{title}）=>(
{title}
);

乍一看，我认为它为

App

常量分配了一个箭头函数。然后我注意到它没有使用大括号，而是使用括号

我知道arrow函数应该是

（…）=>{…}

，但这里它使用

（…）=>（…）

---

那么，它是不是一个箭头函数？如果是，为什么会有另一种形式？我如何决定何时使用哪种形式？如果不是，这个函数类型在js中叫什么？

是的，它也是一个箭头函数。唯一的区别是，如果不使用大括号，它将强制返回：

const App = () => { return true; } // with braces you've to use the return statement

const App = () => true; // without braces it forces the return statement automatically

---

使用语法时：

const a = ({ foo }) => ( <Component /> );

这将指示已执行的操作，但不会返回任何内容。例如，要从函数返回任何内容，必须存在“return”关键字，如下所示：

const c = ({ baz }) => { return <AnotherComponent />; }

const c=（{baz}）=>{return；}

---

带有返回（隐式或其他）的第一个和第三个示例对于可重用函数和/或组件很有用。中间一个是不返回任何内容，对于状态管理（例如mobx/redux/flux）更有用，因为您需要实现HOF或返回状态或对象的函数。

这是隐式返回。1。对2.为什么不呢？3.这取决于您，只有在无法立即返回值时才需要大括号。4.不适用。

（…args）=>expr

相当于

（…args）=>{return expr；}

-一种常用格式的快捷方式。您是否选中了？第二种形式也仅适用于单个表达式-您不能使用语句。@Amadan的注释完成了答案。这一点很好。如果我的arrow函数在返回之前有多行逻辑，我应该使用大括号还是圆括号？你能直接回答这个问题吗？@Leem在这种情况下，你显然别无选择；您必须使用大括号，因为您需要函数体而不仅仅是返回值。

const c = ({ baz }) => { return <AnotherComponent />; }