Влияет ли использование немедленного возврата на функцию внутри useEffect () каким-либо образом?

Question

Будут ли следующие части кода вести себя по-разному:

A:

  useEffect(() => {
    doSomething();
  }, []);

B:

  useEffect(() => doSomething(), []);

Или они будут вести себя одинаково?

Answer 1

Зависит от того, что возвращает doSomething. Если он возвращает undefined, разницы нет. Если doSomething возвращает функцию, то эта функция будет использоваться в качестве логики удаления c для эффекта.

Если он возвращает что-то еще, я думаю, это игнорируется реакцией, но вы хотите быть уверенным. Поскольку я в основном разрабатываю для машинописного текста, я никогда не возвращаю ничего, кроме undefined или функции, поскольку возвращение чего-либо еще является ошибкой типа.

Answer 2

Итак, когда вы возвращаете функцию из useEffect, она говорит, что указанная функция будет запущена до того, как useEffect запустится снова. Таким образом, в основном, вы возвращаете функцию очистки из useEffect.

рассмотрите этот сценарий

useEffect(()=>{

  const timer = setTimeout(()=>{
     setResult(result+1)
  },3000)
  return ()=>{
     clearTimeout(timer)
  }

},[result])

Приведенный выше код по существу говорит, что когда тайм-аут выполнен, ваше состояние результата будет увеличено на один, и когда в следующий раз эта же функция будет выполнена, ваша предыдущая переменная таймера будет очищена.

Кроме того, если вы передаете пустой массив в useEffect и возвращаете функцию очистки, она действует так же, как componentWillUnmount метод.

Answer 3

Что может быть полезным для возврата функции внутри useEffect? Из того, что я вижу, нет веской причины добавлять эту сложность.