제로초님 강의 감사합니다. 근데 useMemo에서요!!

정리하자면 setWinNumbers에 getWinNumbers()를 넣었다고 해도

코드가 useState(getWinNumbersMemo)라면 리렌더링 시 getWinNumbers()가 호출되는 곳이 없으므로 getWinNumbers는 실행되지 않습니다.

onClickRedo 함수는 클릭을 할 때, 그 때만 호출됩니다. 그 때 내부에 있는 getWinNumbers도 호출되는 것이고요. 그래서 따로 처리를 하지 않아도 클릭할 때만 getWinNumbers가 호출됩니다.

useState에 useMemo를 써준 것은 컴포넌트 리렌더링 시마다 useState의 getWinNumbers가 다시 호출되기 때문입니다. 그래서 여기서는 다시 호출되는 것을 막으려고 useMemo를 쓴 것이고요.

제로초님 감사합니다.!!

좀 이따 생각을 좀 정리해봐야겟네요 ㅎㅎ..

오늘 하루도 수고하셨습니다.

내일도 좋은 하루 보내십쇼!!

아 이해했습니다.

메모한 상태에서 onClickRedo를 클릭할 때 setWinNumbers(getWinNumbers())를 하면 setWinNumbers를 호출했으니 getWinNumbers()가 한 번 호출된 후 리렌더링이 되는데요.

리렌더링 때부터는 어차피 useState에 memo된 getWinNumbersMemo가 들어있으니 getWinNumbers가 호출되는 일이 없습니다. useState(getWinNumbersMemo)이지 useState(getWinNumbers())가 아니니까요.

개발자도구 Component 메뉴로 보시면 좀 더 정확한데요. onClickRedo를 했을 때 winNumbers랑 memo해둔 getWinNumbersMemo랑 다른 값입니다. 즉, memo된 값은 처음 렌더링될 때만 사용되는 값이고, 그 다음 setWinNumbers할 때부터는 memo된 기존 값은 아예 사용되지 않습니다.

개발자도구에서 Component 메뉴를 켜놓으시고 Lotto 컴포넌트를 클릭한 후 hooks에서 memo 값과 state값을 비교해보세요.

그 부분은 이해했습니다.

제가 말을 잘 못해서 그런지  핀트가 어긋나는거 같네요ㅠㅠ

const [winNumber, setWinNumber] = useState(getWinNumbers())

메모를 안한 useState의 초기값일때 

onClickRedo

setWinNumbers(getWinNumbers())

각각 6번씩 getWinNumbers 함수가 6번씩 호출이 되자나요.

그런데

const [winNumber, setWinNumber] = useState(memoGetWinNumbers())

메모를 한 useState의 초기값일때 ( 이 때는 memo를 했으니 getWinNumbers()함수 한번 호출)

onClickRedo

setWinNumbers(getWinNumbers())

onClickRedo의 setWinNumbers(getWinNumbers())

메모를 안한 getWinNumbers()가 호출 되므로

redo가 호출 될때 getWinNumbers()가 6번 호출되어야하는거 아닌가요?

귀찮게 해드려서 죄송합니다.

그리고 고맙습니다.

useState는 리렌더링이 발생하는 상황이면 어떤 상황이든지 계속 호출됩니다. bonus가 바뀌어도,  redo나 winBalls가 바뀌어도, winNumbers가 바뀌어도 매번 호출됩니다. 그래서 memo를 하는 것이고요.

위의 상황 모두에서

일단은 onClickRedo는 한번만 실행되요~

제가 질문을 잘못했네요.

onClickRedo가 한번만 실행되는건 아는데

왜

jsx 38번째 줄의

useState(getWinNumbers())가 왜 계속 호출될까요

onClickRedo의 setWinNumbers(getWinNumbers())가 그대로인데

winNumbers가 memo된 상태에서 메모안된 getWinNumbers로 다시 바꿧으니 콘솔이 계속 나와야하는거 아닌가요?

38번째 줄이 어떤 상황에서 호출되는지 불분명합니다. onClickRedo 안에 콘솔로그 넣어보세요.

처음 useState의 useMemo를 적용 전에는

첫 렌더링때와

한번 더 눌렀을때 둘다 콘솔로그가 계속 나오고

///

onClickRedo 함수는 클릭을 할 때, 그 때만 호출됩니다. 그 때 내부에 있는 getWinNumbers도 호출되는 것이고요. 그래서 따로 처리를 하지 않아도 클릭할 때만 getWinNumbers가 호출됩니다.

///

onClickRedo 함수는 클릭을 할 때, 그 때만 호출이되는거면

여기서도 한번만 찍혀야 되는거 아닌가용?

제가 혹시 이해 못한 부분이 있다면 지적 부탁드립니당.

================================================================

useState에 첫 데이터에 useMemo를 적용햇을때

onClickRedo의 setWinNumbers(getWinNumbers())가 그대로인데

winNumbers가 memo된 상태에서 메모안된 getWinNumbers로 다시 바꿧으니 콘솔이 계속 나와야하는거 아닌가요?

왜 하나만 찍히는지 ....

제가 혹시 이해 못한 부분이 있다면 지적 부탁드립니당.

감사합니다.!!