跨页运算符 [重复]

Question

我有来自youtube教程的代码，我无法弄清楚为什么我们需要括号（注释行），如果有人可以用简单的方式解释这段代码......谢谢

  const [{count, count2}, setCount] = useState({count: 10, count2: 20})

  return (
    <div className="App">
      <button onClick={ () => 
        setCount(
          currentState => (//can not understand
            {...currentState, count: currentState.count+1}
          )
        )}>+</button>
      <h5>Count 1: {count}</h5>
      <h5>Count2: {count2}</h5>
    </div>
  )

Answer 1

为什么我们需要括号

我想因为没有它们（），它将无法正常工作，即使在编译时也会引发错误。

setCount(
  currentState => (//can not understand
    {...currentState, count: currentState.count+1}
  )
)

setCount是setState挂钩。它有两种语法：

< Li > < code > set count(newStateOfCount)(用直接值设置状态) < li> setCount( oldCount =

你的是第二个。回调返回一个对象，你有2个选项：

currentState => {
  return {
    ...currentState, 
    count: currentState.count+1
  }
} 

这比

currentState => ({
  ...currentState, 
  count: currentState.count+1
})

所以在教程中，他使用了第二种语法，因为它更简洁。

如果没有括号，它将无法工作：

currentState => {
  ...currentState, 
  count: currentState.count+1
}

因为解析器将理解< code>{是< code >函数体的开始，而不是< code >对象，所以如果不显式地给它< code>()，解析器将无法理解它

Answer 2

这与点差运算符无关。

<代码>=

< li >一个表达式 < li >一个街区

因为，在JavaScript中，{可以启动块或对象初始化器（这取决于上下文），所以在任何可以放置块但想要对象初始化器的地方，您都需要将其添加到（）中，以便将{视为表达式的开始。