useReducer 中是否需要使用展开运算符？

Question

编辑：检查布莱恩的答案后，我发现即使在第二个示例中，删除...state也会导致与第一个示例相同的行为，所以这个问题问是错误的。我不确定是什么导致了错误的行为，并对造成的任何不便表示歉意。布莱恩的回答很好地解释了用途。比较以下 2 个代码片段，它们通过使用 一次更新 2 个状态来完成相同的操作initialState，除了一个使用useState，另一个使用useReducer：useStateconst {useState} = React;const initialState = {  name: 'John',  age: 20};const Example = () => {  const [state, setState] = useState(initialState);  const handleName = () => {    setState({...state, name: 'Tom'});  }    const handleAge = () => {    setState({...state, age: 30});  }  return (    <div>      <p>{state.name}</p>      <p>{state.age}</p>      <button onClick={handleName}>        Click to change name      </button>      <button onClick={handleAge}>        Click to change age       </button>    </div>  );};ReactDOM.render(  <Example />,  document.getElementById("react"));<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.4/umd/react.production.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.4/umd/react-dom.production.min.js"></script><div id="react"></div>如果在第一个示例中删除...state，它将状态设置为单个键/值对，因此不再起作用。我原以为第二个例子中会发生同样的事情，但事实并非如此。第二个示例在删除扩展运算符后效果很好。我对第二个例子有3个问题：扩展运算符有什么用？为什么删除扩展运算符后它仍然有效？如果没有扩展运算符也能正常工作，这是否意味着第二个示例中不需要扩展运算符？