React Native中状态更新时展开运算符加括号与不加的差异原因
2026-8-20
为什么React Native状态更新时箭头函数返回对象需要加括号？
这是JavaScript箭头函数的语法规则导致的：
- 当箭头函数使用隐式返回（不写
return关键字）时，如果要返回的是一个对象字面量，必须把对象用括号()包裹起来。 - 直接写
oldValue => {...oldValue, someField: 'newValue'}时，JavaScript解析器会把这里的{}当成代码块的开始和结束标记，而非对象字面量。里面的...oldValue会被识别为无效的独立语句，整个函数实际没有返回任何值（默认返回undefined），所以状态更新不生效。 - 加上括号
()后，({...oldValue, someField: 'newValue'})会被解析器识别为对象字面量表达式，箭头函数会隐式返回这个新对象，状态就能正常更新。
举个直观的对比例子：
- 错误写法：
const getObj = () => { key: 'value' }→ 函数返回undefined，因为{}被当作代码块 - 正确写法：
const getObj = () => ({ key: 'value' })→ 函数返回{ key: 'value' }对象
内容的提问来源于stack exchange，提问作者Karol Trzaska
相关产品推荐
相关产品推荐
