Почему useReducer настроен таким образом? Такое чувство, что он пишет код задом наперед?

Question

const initialState = {count: 0};

function reducer(state, action) {
  switch (action.type) {
    case 'increment':
      return {count: state.count + 1};
    case 'decrement':
      return {count: state.count - 1};
    default:
      throw new Error();
  }
}

function Counter() {
  const [state, dispatch] = useReducer(reducer, initialState);
  return (
    <>
      Count: {state.count}
      <button onClick={() => dispatch({type: 'decrement'})}>-</button>
      <button onClick={() => dispatch({type: 'increment'})}>+</button>
    </>
  );

Это взято непосредственно из документации React. Я хочу быть конкретным с этой одной строкой кода:

const [state, dispatch] = useReducer(reducer, initialState);

Во вновь создаваемых переменных, состоянии и диспетчеризации мы назначаем редуктор для отправки и initialState для состояния. Это кажется отсталым для меня. Зачем нам сначала объявлять наше состояние, если useReducer присваивает значение из второго параметра функции (initialState). Я надеюсь, что мне ясно по этому вопросу ... Я знаю, что может быть сложно понять, что я спрашиваю. По сути, почему бы не настроить код таким образом?

const [dispatch, state] = useReducer(reducer, initialState);

Или:

const [state, dispatch] = useReducer(initialState, reducer);

Answer 1

useReducer возвращает массив, первое значение которого является состоянием, а второе значение является отправкой. Вы деструктурируете эти значения.

const someArray = () => ['value1','value2']
const [value1 , value2] = someArray()
console.log(value1)
console.log(value2)

Насколько порядок таков:

useState возвращает массив как [state, setState]

useReducer возвращает массив как [state , dispatch]

Как вы можете видеть, оба очень похожи

Более того: aОбщей темой при вызове функции является передача в качестве первого аргумента основного аргумента (reducer), а затем его параметров (initialState). useReducer(reducer, initialState)

Обновлено Изменить расширенный ответ:

Это потому, что вы всегда будете передавать основной аргумент и не сможете передавать его параметры

Если useReducerпотребовав, чтобы вы вызывали его с useReducer(initialValues, reducer), вы не сможете вызвать его без значений initalValues, таких как useReducer(reducer), поскольку useReducer будет считать, что редуктор - это ваши initalValues, и что редуктор не был передан.

ReactВместо этого команда могла бы принять объект, такой как {initalValues, reducer}, и порядок не имел бы значения, но это не так