[hooks] useState

1. useState 훅은 state와 setState를 배열형태로 반환해준다. setState를 사용해서 state를 변경할 때마다, 컴포넌트는 다시 렌더링이 된다.

 

const [state, setState] = useState(초기값);

 

 

2. state를 변경할 때, 새로 변경된 state값이 이전 state값과 연관이 되어 있다면 setState의 인자로 새로운 state를 리턴하는 콜백함수를 넣어주는게 좋다. (콜백 함수란? () => {})

   setState((prevState) => {
        return newState;

   });

3. useState를 사용해서 어떤 무거운 일을 해야한다면 useState의 인자로 콜백함수를 넣어주면 맨 처음 렌더링할 때만 실행되게 할 수 있다.

useState (() => {
	return heavyWorks();
})