state?

const [state, setState] = useState("철수")

state는 데이터를 담아주는 상자라고 생각하면 된다
setState는 상자안에 담아주는 값을 변경하는 역할을 하며
useState는 상자안에 담긴 값을 보여주는 상자 포장(?) 이라고 생각하면 쉬울듯 하고
("철수") 는 상자 포장에 적힌 내용이다

카운트를 올려주는 함수 만들기

사진처럼 카운트를 올려주는 함수만들었다 기대하는 결과값은 4씩 올라 갈것 같지만

1씩올라가게 된다
이 문제를 해결하기 위해서 사용하는 것이 prev이다.

---

Prev?

위 처럼 코드를 작성하면 결과값은 4씩 증가하게 된다

prev 하나로 달라지게 되었는데
첫번째 prev에 초기값인 0이 들어가 1이 더해져 1이되고
두번째 prev에 1이 들어가 1이 더해져 2가 되고
이동작을 반복해 총 4씩 올라가는 함수를 만들어줄 수 있다

---

setState와 prev의 차이점

setState는 비동기 방식으로 작동하기 때문에 4씩 올라가는것이 아닌 1씩 올라가는것이다

prev 라는 임시저장박스에 값을 담아주고 그것을 가져와서 다시 사용한뒤 최종적으로 함수가 모두 실행되었을 때 그때 값을 반환한다
총 4씩 올라가는 결과 발생

이런 차이점이 있기 때문에 필요한곳에 유용하게 쓰면 좋을것 같다!