Reagir useEffect em profundidade / use of useEffect?

Estou tentando entender o useEffectgancho em profundidade.

Gostaria de saber quando usar qual método e por quê?

1.useEffect with no second paraments
 useEffect(()=>{})

2.useEffect with second paraments as []
  useEffect(()=>{},[])

3.useEffect with some arguments passed in the second parameter
 useEffect(()=>{},[arg])

useEffect(callback)

Executa em cada renderização de componente.

Normalmente usado para depuração, análogo à execução do corpo da função em cada renderização:

const Component = () => {
  callback()
  return <></>;
};

useEffect(callback,[])

Executa uma vez em uma montagem de componente.

Geralmente usado para inicializar o estado dos componentes, buscando dados etc.

Nota : O retorno de chamada executado após a fase de renderização (conhecido como "Gotcha").

useEffect(callback,[arg])

Executa a mudança de argvalor.

"On Change" refere-se à comparação superficial com o valor anterior de arg(compara o valor da argrenderização anterior e a atual prevArg === arg ? Do nothing : callback()).

Geralmente usado para executar eventos em adereços / alteração de estado.

Nota: Várias dependências podem ser fornecidas: [arg1,arg2,arg3...]

• Um guia completo de useEffectDan Abramov
• useEffectAPI .
• Usando o gancho de efeito - Reagir documentos.

Se você estiver familiarizado com os métodos do ciclo de vida da classe React, considere usar o Hook Effect como componentDidMount, componentDidUpdate e componentWillUnmount combinados.

1.useEffect sem segundo parâmetro: usado quando queremos que algo aconteça quando o componente acabou de ser montado ou se ele foi atualizado. Conceitualmente, queremos que isso aconteça após cada renderização.

2.useEffect com segundos parâmetros como []: é usado quando queremos que algo aconteça no momento da montagem do componente, se for executado apenas uma vez no momento da montagem.

3.useEffect com alguns argumentos passados ​​no segundo parâmetro: Isso é usado quando queremos que algo aconteça no momento em que o pramter passou por exemplo. args mudaram no seu caso.

Para mais informações. verifique aqui: https://reactjs.org/docs/hooks-effect.html

3.useEffect com alguns argumentos passados ​​no segundo parâmetro useEffect (() => {}, [arg])

ele será executado primeiro e será executado novamente se o arg mudar

Lembre-se também de perguntar sobre o retorno dentro do useEffect ... Seus usos para limpeza serão executados quando o componente desmontar