[TIL] Hook과 useState

j1_0·2022년 12월 15일

DAY 32<REACT HOOK>

HOOK

hook은 컴포넌트 재구성을 강요하며 코드의 추적을 어렵게 만들던 이전의 react의 불편함을 해소하기 위해 만들어진 것으로 컴포넌트로부터 상태 관련 로직을 추상화 할 수 있고 독립적인 테스트와 재사용이 가능할 수 있게 만들어준다.

  • Hook은 계층의 변화 없이 상태관련 로직을 재사용할 수 있도록 도와주는 특별한 함수.

  • Hook은 함수 컴포넌트를 사용하던 중 sate를 추가하고 싶을때 클래스 컴포넌트로 바꾸지 않고 함수 컴포넌트 안에서 hook을 이용해 사용한다.

  • Hook의 이름은 항상 use로 시작된다.

useState

const [example,setExample]=useState();
useState는 변수, 해당 변수를 갱신할 수 있는 함수의 쌍을 반환한다.
해당 변수를 리렌더링할 때 기억하고 가장 최근에 갱신된 값을 제공한다. example 변수값을 갱신하려면 setExample을 호출하면 된다.

To do list를 만들면 조금은 익숙해진 useState 앞으로 배우고 익숙해져야 할 hook이 산더미..!
hook의 개념의 잡고 이해해보자!

2개의 댓글

comment-user-thumbnail
2022년 12월 15일

hook 정복 그날까지!

1개의 답글