리엑트 hook 정리

React Hook?

기존 Class 바탕의 코드 작성 필요없이 React 기능 사용

useState

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

const [state, setState] = useState({
  param1 : "초기화",
  param2 : "초기화"
})

• 컴포넌트에서 가변 상태를 지닐 수 있게 해준다.
• 상태관리가 필요할 때 사용

useEffect

useEffect(함수, deps)

//수행하고자하는 함수, 검사하고자하는 배열
useEffect(()=>{},[])

• 랜더링 될 때마다 특정 작업 수행하도록 설정할 수 있는 hook
• 클래스형컴포넌트에서 componentDidMount와 componentDidUpdate, componentWillUnmount를 합친 형태
• 2번째 인자값으로 빈배열을 넣을 경우 마운트 될때만 실행된다(첫번째 랜더링 이후)

useMemo

//수행하고자하는 함수, 검사하고자하는 배열
useMemo(함수, deps)

• 연산할 값을 랜더링시 재사용할때 쓰인다.
• 배열안의 값이 바뀌지 않으면 이전의 연산한 값을 재사용 한다

useCallback

//수행하고자하는 함수, 검사하고자하는 배열
useCallback(함수, deps)

• 특정함수를 재사용할 때 사용
• 배열안의 값이 바뀌지 않으면 이전의 연산한 값을 재사용 한다