[TIL] 2023-02-04

• 리액트 기본서, 클래스 컴포넌트가 아니라 함수 컴포넌트를 권장하는 이유 중 하나인 훅에 대해서 공부함 - 기본서 예제를 통해서 동작 흐름과 코드 재사용, 단순해진 코드를 직접 확인해봄 (간단한 숫자counter)

  • 훅(hook)은 함수다.
  • 클래스 컴포넌트의 복잡함과 모호함을 극복할 목적으로 만들어짐
    • 클래스에 많은 기능이 숨어 있어 코드가 직관적이지 않음
    • 컴포넌트에 구현한 일부 코드를 다른 컴포넌트를 구현할 때 재사용할 마땅한 방법이 없음
  • 함수 컴포넌트 - 라이프 사이클 메서드가 없음

• 훅(hook) 종류
  
  
  컴포넌트 데이터 관리 - useMemo, useCallback, useState, useReducer
  
  
  컴포넌트 생명주기 대응 - useEffect, useLayoutEffect
  
  
  컴포넌트 메서드 호출 - useRef, useImperativeHandle
  
  
  컴포넌트 간의 정보공유 - useContext

• 훅(hook) vs 클래스
  
  
  코드 재사용
  • 특정 컴포넌트가 아닌 다양한 컴포넌트에서 원하는 대로 재사용할 수 있다.
  • 어떤 특정 클래스에 종속되지 않기 때문에 코드를 재사용하기 쉽다.
  • 사용되는 위치에 관계없이 특정기능을 제공하는데 초점
    
    
    단순성
    코드의 가독성이 좋아짐