Skip to content

Commit 838af63

Browse files
takanoripsmikitky
andauthored
Apply suggestions from code review
Co-Authored-By: smikitky <smiki-tky@umin.ac.jp>
1 parent aca0f33 commit 838af63

File tree

1 file changed

+3
-2
lines changed

1 file changed

+3
-2
lines changed

content/docs/hooks-effect.md

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ class Example extends React.Component {
8787

8888
これは、コンポーネントがマウント直後なのか更新後なのかに関係なく、大抵の場合は同じ副作用を起こしたいからです。概念的には、毎回のレンダー時に起こってほしいのですが、React のクラスコンポーネントにはそのようなメソッドは存在していません。副作用のコードを別のメソッドに抽出することは可能ですが、2 か所でそのメソッドを呼ばなければいけないことに変わりはありません。
8989

90-
では、同じことが `useEffect` フックを用いればどのように可能なのか見ていきましょう
90+
では、同じことが `useEffect` フックを用いるとどのように記述できるのか見ていきましょう
9191

9292
### フックを使った例
9393

@@ -116,7 +116,8 @@ function Example() {
116116

117117
**`useEffect` は何をやっているのか?** このフックを使うことで、レンダー後に何かの処理をしないといけない、ということを React に伝えます。React はあなたが渡した関数を覚えており(これを「副作用(関数)」と呼ぶこととします)、DOM の更新の後にそれを呼び出します。この副作用の場合はドキュメントのタイトルをセットしていますが、データを取得したりその他何らかの命令型の API を呼び出したりすることも可能です。
118118

119-
**`useEffect` がコンポーネント内で呼ばれるのはなぜか?** コンポーネント内で `useEffect` を記述することで、副作用内から state である `count`(や任意の props)にアクセスできるようになります。それらは既に関数スコープ内に存在するので、読みだすために特別な API は必要ありません。フックは JavaScript のクロージャを活用しており、JavaScript で解決できることに対して React 特有の API を導入することはしません。
119+
**`useEffect` がコンポーネント内で呼ばれるのはなぜか?** コンポーネント内で `useEffect` を記述することで、副作用内から state である `count`(や任意の props)にアクセスできるようになります。それらは既に関数スコープ内に存在するので、参照するための特別な API は必要ありません。フックは JavaScript のクロージャを活用しており、JavaScript で解決できることに対して React 特有の API を導入することはしません。
120+
```参照するための
120121
121122
**`useEffect` は毎回のレンダー後に呼ばれるのか?** その通りです! デフォルトでは、副作用関数は初回のレンダー時*および*毎回の更新時に呼び出されます。あとで[カスタマイズする方法](#tip-optimizing-performance-by-skipping-effects)について説明します。「マウント」と「更新」という観点で考えるのではなく、「レンダーの後」に副作用は起こる、というように考える方が簡単かもしれません。React は、副作用が実行される時点では DOM が正しく更新され終わっていることを保証します。
122123

0 commit comments

Comments
 (0)