ECMAScript6箭头函数，返回一个对象

提问于 2024-05-01T03:10:48+08:00

浏览次

483

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

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

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

p => 'foo'

有什么明显的东西我不见了吗？

3 回答

48
您必须将返回的对象文字包装到括号中 . 否则花括号将被视为表示函数的主体 . 以下作品：
```
p => ({ foo: 'bar' });
```
您不需要将任何其他表达式包装到括号中：
```
p => 10;
p => 'foo';
p => true;
p => [1,2,3];
p => null;
p => /^foo$/;
```
等等 .

参考：MDN - Returning object literals
回复于 2024-05-01T03:10:48+08:00
11
如果箭头函数的主体包裹在花括号中，则不会隐式返回它 . 将对象括在括号中 . 它看起来像这样 .
```
p => ({ foo: 'bar' })
```
通过将主体包裹在parens中，该函数将返回 { foo: 'bar } .

希望，这可以解决您的问题 . 如果没有，我最近写了一篇关于箭头功能的文章，它更详细地介绍了它 . 希望对你有帮助 . Javascript Arrow Functions
回复于 2024-05-01T03:10:48+08:00
865
您可能想知道，为什么语法有效（但没有按预期工作）：
```
var func = p => { foo: "bar" }
```
这是因为JavaScript's label syntax：

因此，如果您将上述代码转换为ES5，它应该如下所示：
```
var func = function (p) {
  foo:
  "bar"; //obviously no return here!
}
```
回复于 2024-05-01T03:10:48+08:00

相关问题