Reactの副作用（Side Effects）とは？

Reactの副作用（Side Effects）とは？

Reactの副作用（Side effects）というのは、コンポーネントの主な仕事（表示をすること）以外に起こることです。例えば、小学生のあなたが絵を描いているとします。絵を描くのがあなたの「主な仕事」です。でも、絵を描きながら歌を歌うと、それは絵を描く「副作用」ですね。Reactでの副作用はそれと似ていて、データを取得したり、タイマーを設定したりすることです。これらは画面に何かを表示する直接の仕事ではないけれど、大切な作業なんです。

ユーズステート（useState）とは？

ユーズステート（useState）は、Reactで使う特別なおまじないのようなものだよ。例えば、ビデオゲームでキャラクターが持っているコインの数を覚えておくには、どうしたらいいかな？「ユーズステート」を使うと、そのコインの数を覚えておいて、コインを拾ったら数を増やしたり、使ったら減らしたりできるんだ。

ユーズエフェクト（useEffect）とは？

ユーズエフェクト（useEffect）は、ある特別なことが起きた時だけ、何か特別なことをするおまじないだよ。たとえば、お母さんが「宿題を終えたらゲームをしていいよ」と言ってくれたとするね。ここで「宿題を終える」というのが特別なことが起きた時、それに反応して「ゲームをする」という特別なことをするんだ。

useContextとは？

useContextは、Reactの中で「共有スペース」のようなものだよ。学校でみんなが使えるクレヨンがある箱を想像してみて。どの子もその箱からクレヨンを取って絵を描いたり、違う色が必要になったら箱に戻したりできるよね。

useRefとは？

useRefは、Reactで「永続的なマーカー」をつけるために使う特別なツールだよ。たとえば、あなたが図書館で読んでいる本にしおりを挟んでおくと、次にその本を開いた時にすぐにどこを読んでいたかわかるでしょ？ しおりは本の中で動かないから、いつでも同じ場所を示してくれる。

useMemoとは？

useMemoは、Reactで「頭の中で考えたことを忘れないようにする」ために使うおまじないだよ。たとえば、あなたが算数のテストで難しい問題を解いたとして、その答えを次の問題を解く時にも使いたいと思うよね。その答えをノートにメモしておけば、何度も同じ計算をしなくても、いつでもその答えを見ることができる。

useCallbackとは？

useCallbackは、特定の作業をするための手順を忘れないようにするおまじないだね。例えば、あなたが折り紙を折る手順を覚えていて、それを何度も同じように折りたい時、毎回折り方の本を見るのは大変だよね。だから、その手順を一度覚えてしまえば、次からは覚えた手順でサッと折り紙を折れるでしょ？