주니어개발자성공하자

전 게시물인 useMemo와 비슷한 Hook입니다. useMemo는 특정 결과값을 재사용할 때 사용하는 반면, useCallback은 특정 함수를 재사용 하고 싶을 때 사용합니다. 메모이제이션 const memoizedCallback = useCallback(함수, 배열); 첫번째 인자는 함수를 두번째 인자는 넘어온 배열의 값이 변경 될 때까지 저장하여 재사용 할 수 있다. 예를 들어 컴포넌트 함수안에 함수가 선언되어 있다면 이 함수는 컴포넌트가 랜더링 될 때 마다 새로운 함수가 생성된다. const add = () => x + y; 하지만 useCallback을 사용하면 해당 컴포넌트가 랜더링 되더라도 의존 배열이 바뀌지 않는한 기존 함수를 계속 반환합니다. x와 y 값이 바뀌면 새로운 함수가 생성되어..

useEffect라는 Hook을 사용하여 컴포넌트가 마운트되거나 언마운트 됐을때, 또 업데이트가 되었을때 특정 작업을 처리하는 방법에 대해 알아보자 마운트 / 언마운트 useEffect(() => { console.log('컴포넌트가 화면에 나타남'); return () => { console.log('컴포넌트가 화면에서 사라짐'); }; }, []); useEffect를 사용 할 때에는 첫번째 파라미터에는 함수, 두번째 파라미터에는 deps를 넣는다. 만약 deps를 위와같이 비워두게 되면 처음 마운트 됐을때만 호출된다. useEffect에서는 함수를 반환 할 수 있는데 이름 cleanup 함수라고 부른다. 후처리라고 생각하면 편하다. deps 에 특정 값 넣기 useEffect(() => { cons..