箭头函数中的大括号

Question

有人可以，请解释以下内容：

我正在听 Dan Abramov 的讲座并做练习。

代码工作正常，但是，当以下特定 function用大括号**{ }**编写时，测试失败。

    case 'toggleTodo' :
        return (
            state.map( (one) => {
                oneTodo( one, action )
            })
        );

相同的代码在没有大括号的情况下也能正常工作。

    case 'toggleTodo' :
        return (
            state.map( (one) => 
                oneTodo( one, action )
            )
        );

这是 JsBin 。 请参考第 31 行之后的内容。

Answer 1

这对大括号形成一个块，其中包含一个语句列表。 您需要显式使用return语句来使函数返回某些内容。

如果省略大括号，箭头函数有一个简洁的主体，它只包含一个表达式，其结果将隐含地成为函数的返回值。

Answer 2

case 'toggleTodo' :
    return (
        state.map( (one) => 
            oneTodo( one, action )
        )
    );

等于：

case 'toggleTodo' :
    return (
        state.map( (one) => {
            return oneTodo( one, action )
        })
    );

见退货声明

Answer 3

当箭头 function 内有多个语句时，使用花括号是一种公平的做法。使用花括号将多个语句作为一个块，避免在箭头 function 内出现错误。