在括号中使用排列运算符和不使用排列运算符有什么区别



今天我遇到了不可能使用旧的状态值在react native中设置状态,然后使用如下排列运算符:

setSomeValue(oldValue => {...oldValue, someField: 'newValue'})

有必要添加括号:

setSomeValue(oldValue => ({...oldValue, someField: 'newValue'}))

然后一切都很好。

原因是什么?

使用{}定义箭头函数块。因此,当您执行() => {}时,您不会返回对象。你什么也不回。

您可以更新此代码以将对象返回为:

() => {
return { someField: 'newValue' }
}

但是JS提供了一个使用括号()创建表达式并返回它的快捷方式

因此,() => ()将返回第二个()中的任何表达式。所以当您执行() => ({ someField: 'newValue' })时,现在您直接返回一个对象,而不创建块并执行隐式返回。

setSomeValue(oldValue => ({...oldValue, someField: 'newValue'}))

相当于以下语句

setSomeValue(oldValue => {
return {...oldValue, someField: 'newValue'};
})

最新更新