ECMAScript6箭头函数返回一个对象

当从箭头函数返回一个对象时，由于语法中的含糊不清，似乎有必要使用额外的一组{}和一个return语句：

p => { return { foo: 'bar' } }

如果箭头函数返回其他内容，那么{}和return是不必要的，例如：

p => 'foo'

有什么明显的我失踪？

Answer 1

您必须将返回的对象字面值包装到括号中。 否则，大括号将被视为表示function的身体。 以下工作：

 p => ({ foo: 'bar' }); 

您不需要将任何其他expression式包装到括号中：

 p => 10; p => 'foo'; p => true; p => [1,2,3]; p => null; p => /^foo$/; 

等等。

Answer 2

您可能会想，为什么语法是有效的（但不能按预期工作）：

 var func = p => { foo: "bar" } 

这是因为JavaScript的标签语法 ：

所以如果你把上面的代码转换成ES5，它应该看起来像这样：

 var func = function (p) { foo: "bar"; //obviously no return here! } 

Answer 3

如果箭头函数的主体包裹在花括号中，则不会隐式返回。 将对象包裹在圆括号中。 它看起来像这样。

 p => ({ foo: 'bar' }) 

通过将身体包裹在parens中，该函数将返回{ foo: 'bar } 。

希望能解决你的问题。 如果不是的话，我最近写了一篇关于箭头函数的文章，里面详细介绍了它。 希望对你有帮助。 Javascript的箭头函数