Установка объекта в React Hook

Question

Существуют ли различия в настройке объекта в React Hook с помощью этих двух подходов?

const INITIAL_STATE = {
    foo = '',
    bar = ''
}

// ...

// Method 1
const [state, setState] = useState(INITIAL_STATE);

// Method 2
const [state, setState] = useState({ ...INITIAL_STATE });

Оба метода работают нормально, я просто хочу знать, есть ли какие-либо недостатки или преимущества использования одного над другим.

Answer 1

useState будет использовать начальное состояние только при первом вызове. Но он будет вызываться при каждом рендере, и { ...INITIAL_STATE } будет каждый раз создавать новый неиспользуемый объект. Эти накладные расходы должны быть незаметными.

Answer 2

Метод 1 передает исходный объект, что означает, что ловушка всегда будет использовать ссылку на этот исходный объект.

Метод 2 создает новый объект путем распространения оригинала на новый, что означает, чтокрючок больше не будет ссылаться на исходный объект.