Czy wartość do zmiennej const na nowo się pyrzpisze przy ponownym wywołaniu useEffect w React?

useEffect(() => {
    const exampleValue = 3;
    
  }, [update]);

Czy w tym przypadku jeśli zmieni się wartość zmiennej update to za każdy razem na nowo jest przypisywana wartość do zmiennej const exampleValue? Czy wystarczy, że przy pierwszy wywołaniu useEffect zostanie coś przypisane do zmiennej exampleValue i potem już to się nie zmienia?

Jeśli uruchomisz sobie taki fragment

useEffect(() => {
  const exampleValue = Math.random();

  console.log(exampleValue);
}, [update]);

to zobaczysz, że wartość będzie się zmieniać za każdym razem.

EDIT:
Jeśli chciałbyś zapisać tą wartość jedynie raz to musiałbyś przenieść ten kod do useState

const [stateRandom, setStateRandom] = useState(() => {
  return Math.random();
});

useEffect(() => {
  const exampleValue = Math.random();

  console.log(stateRandom);
  console.log(exampleValue);
}, [update]);

Xarviel napisał(a):

Jeśli uruchomisz sobie taki fragment

useEffect(() => {
  const exampleValue = Math.random();

  console.log(exampleValue);
}, [update]);

to zobaczysz, że wartość będzie się zmieniać za każdym razem.

EDIT:
Jeśli chciałbyś zapisać tą wartość jedynie raz to musiałbyś przenieść ten kod do useState

const [stateRandom, setStateRandom] = useState(() => {
  return Math.random();
});

useEffect(() => {
  const exampleValue = Math.random();

  console.log(stateRandom);
  console.log(exampleValue);
}, [update]);

Jak to jakbym chciał zapisać tą zmienna jedynie raz to musiałbym zapisać ją do useState'a. Nie rozumiem.

I generalnie ciekawi mnie jaka jest różnica między czymś takim:

 const exampleValue = Math.random();

useEffect(() => {
  console.log(exampleValue);
}, [update]);

a takim?

const [stateRandom, setStateRandom] = useState(() => {
  return Math.random();
});

useEffect(() => {
  const exampleValue = Math.random();
  setStateRandom(exampleValue)
}, [update]);

W pierwszym przykladzie wartosc dla const nie bedzie sie zmieniac? Tylko raz zostanie przypisana wartosc i potem nie bedzie sie zmieniac?

Tutaj zrobiłem Ci przykład online, żeby pokazać jak to działa https://stackblitz.com/edit/react-zxodum?file=src%2FApp.js

import React, { useState } from 'react';

const App = () => {
  const [counter, setCounter] = useState(0);
  const [randomValue, setRandomValue] = useState(() => {
    return Math.random();
  });
  const otherRandomValue = Math.random();

  const updateCounter = () => {
    setCounter(counter + 1);
  };

  return (
    <>
      <button onClick={updateCounter}>Zaktualizuj licznik</button>

      <div>Licznik {counter}</div>
      <div>Losowa wartość ustawiona przez useState: {randomValue}</div>
      <div>Losowa wartość ustawiana bez useState: {otherRandomValue}</div>
    </>
  );
};

export default App;

Kliknięcie w przycisk, zmienia stan komponentu, aktualizuje wartość zmiennej counter i zmusza komponent do ponownego renderowania.

Przy każdym ponownym renderowaniu wartość tej zmiennej

const otherRandomValue = Math.random();

będzie się zmieniać, gdy ten zapis przez useState pozostanie bez zmian

const [randomValue, setRandomValue] = useState(() => {
  return Math.random();
});

Wartość przypisana przez useState zostaje niezmienna pomiędzy kolejnymi metodami cyklu życia https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/