「関数コンポーネント」と「クラスコンポーネント」の違い

「ステート」の使い方が異なる

クラスコンポーネント
ステートに使うのは表示に使われる値
表示に使われるわけではない値はプロパティとして保管しておく
関数コンポーネント
コンポーネントで使われる値は基本的に全てステートとして保管
表示に使われていないものでもコンポーネント内で値を保持するものは全てステートにする

関数コンポーネントは常にリロードされる

クラスコンポーネントは状態維持される
クラスはインスタンスを作成しており、インスタンスはプログラムが実行中の間、常にメモリ内に保管され内容が保たれる
なので、ステートを使わなくとも、プロパティに値を保管しておけば、ページがリロードされるまでずっと保持される
関数コンポーネントはされない
関数は表示や更新などのタイミングで呼び出されて実行され、それで終わってしまう
クラスコンポーネントのように常に状態が保たれるわけではなく、必要に応じて呼び出されている
つまり、常に動いているわけではない

変数ではなくステート

関数コンポーネント内にある変数は、コンポーネントが更新されるたびに関数が再実行されるため常に初期状態に戻る
変数に値を保管しておくことはできない
変数は関数コンポーネント内の処理を実行中の間、一時的に値を保管するもの
コンポーネントの状態として常に値を保管しておきたいものは、全てステートとして用意しておく必要がある

クラスコンポーネントは常にメモリ内に保管されているが、関数コンポーネントはただ実行されるだけ