Javascript 何时应该在ES6 arrow函数中使用return语句

在某些情况下，新的say

return

是隐含的：

表达式也是该函数的隐式返回值

在什么情况下，我需要将

return

与ES6 arrow函数一起使用？

Jackson部分地提出了一个类似的问题：

隐式返回，但仅当不存在块时

• 当一行扩展到多行，程序员忘记添加

  返回时，这将导致错误

• 隐式返回在语法上是不明确的

  （name）=>{id:name}

  返回对象

  {id:name}

  。。。正确的？错。它返回未定义的
  。这些大括号是一个显式块<代码>id:是一个标签

除此之外，我还要补充一个定义：

块语句（或其他语言中的复合语句）用于将零个或多个语句分组。块由一对花括号分隔

示例：

---

我明白这个经验法则

对于有效转换的函数（参数的单行操作），返回是隐式的

候选人包括：

// square-root 
value => Math.sqrt(value)

// sum
(a,b) => a+b

---

对于其他操作（需要块的多个行程序，返回必须是显式的）

箭头函数允许隐式返回：返回值时不必使用

返回

关键字

当函数体中有联机语句时，它工作：

constmyfunction=（）=>“测试”
log（myFunction（））/“test”

这里还有另一个例子

在React中编写功能组件时，可以使用括号来包装隐式返回的JSX

const FunctionalComponent = () => (
  <div>
    <OtherComponent />
  </div>
);

const FunctionalComponent=（）=>(
);

这是另一个给我带来麻烦的案例

// the "tricky" way
const wrap = (foo) => (bar) => {
  if (foo === 'foo') return foo + ' ' + bar;
  return 'nofoo ' + bar;
}

这里我们定义了一个返回匿名函数的函数。“棘手”的一点是，外部函数的函数体（以（bar）=>…）开头的部分）在视觉上看起来像一个“块”，但它不是。因为不是，所以隐式返回开始起作用

以下是wrap的执行方式：

// use wrap() to create a function withfoo()
const withfoo = wrap('foo');
// returns: foo bar
console.log(withfoo('bar'));

// use wrap() to create a function withoutfoo()
const withoutfoo = wrap('bar');
// returns: nofoo bar
console.log(withoutfoo('bar'));

我将其解包以确保理解它的方法是“取消对函数的腐蚀”

这里是第一个代码块的语义等价物，只需让wrap（）的主体显式返回。此定义产生与上面相同的结果。这是点连接的地方。将上面的第一个代码块与下面的代码块进行比较，可以清楚地看到，arrow函数本身被视为

包装的完全未经腐蚀的版本是这样的，虽然没有粗箭头所示的版本那么紧凑，但似乎更容易理解

// the "no arrow functions" way
const wrap = function(foo) {
  return function(bar) {
    if (foo === 'foo') return foo + ' ' + bar;
    return 'nofoo ' + bar;
  };
};

---

最后，对于可能需要阅读我的代码的其他人，以及未来的我，我想我更喜欢非箭头式的版本，它可以在第一眼就被直观地理解，而不是箭头式的版本，它需要相当多的思考（在我的例子中是实验）来摸索。

省略括号{}如果满足以下条件，则箭头函数的返回关键字和返回关键字均为ok： （1） 在return语句和 （2） 您将返回单个实体[注意：单个实体可以是多行。如果是这样，那么您所需要的就是常规括号（），如下面的示例所示：

posts.map（post=>(

{post.title}

))

我不懂那种语法..你是在用一个类创建一个类，然后用一个参数（'Jess'）调用一个隐含的构造函数吗？我想你会这样（（name）=>（{id:'Jess'}））@MichaelDausmann这是一个arrow函数，有一个参数，

name

，函数用括号括起来，用一个参数“Jess”调用。

=>

和

之间的代码（'Jess'））在每种情况下，都是箭头函数的主体。将其视为窗体<代码>的立即调用函数表达式的一种简短形式（函数（name）{返回{ID:name }}）（“jess”）

非常有用的inded！有助于发现承诺中的问题。所有这些都使用箭头函数映射项目，如果使用箭头函数映射数组时没有返回值，您可以注意到是否会得到一个未定义的数组。让箭头函数隐式返回系统化会有什么不利之处？就像coffeescript一样。。（虽然我不喜欢coffeescript）说得很清楚，但似乎因为JS解析器不知道是期望一个表达式（比如一个包含对象文本

{}

）还是一个块的表达式），所以它假设一个

{}

表示一个块。这意味着当它看到

id:name

时，它认为

id:

是一个表达式，它创建了一个（JS的一个非常罕见的功能，它处理流控制并使用

：

），然后

id:

后面的

name

只是一个单独的语句，它只包含变量

name

（&doesnothing）。这应该是正确的答案，尽管需要更多的解释。基本上，当函数体是一个表达式而不是一个块时，该表达式的值会隐式返回。如果我错了，请纠正我。您可以始终使用括号，它与JSX或React无关。

// the explicit return way
const wrap = (foo) => {
  return (bar) => {
    if (foo === 'foo') return foo + ' ' + bar;
    return 'nofoo ' + bar;
  }
}

// the "no arrow functions" way
const wrap = function(foo) {
  return function(bar) {
    if (foo === 'foo') return foo + ' ' + bar;
    return 'nofoo ' + bar;
  };
};