useRef를 사용했을 때와 안 했을 때의 차이점

React 프로젝트를 하면서 useState처럼 값이 바뀜에 따라 컴포넌트가 리렌더링되는 것을 원하지 않는 변수는 useRef를 통해 관리해야 한다는 것을 알고, 그렇게 사용하고 있었다.

그런데 문득 그런 생각이 들었다. useState만 안 쓴다면 useRef가 아닌 그냥 변수로 관리해도 값이 바뀜에 따라 리렌더링이 발생하지 않을 텐데 왜 굳이 useRef를 써야 할까?

// 즉, 이 2가지의 차이를 알고 싶었다.
const var1 = useRef('something')
const var2 = 'something'

그래서 찾아 보았다.

벨로퍼트님의 useRef 글의 댓글에서 이와 관련하여 질문을 하신 분이 이미 계셨다.

useRef 질문 위처럼 나와 똑같은 생각을 가지신 분이 질문을 해주셨고,

useRef 답변 1 useRef 답변 2

두 분께서 답변을 해주셨다.

즉, useRef를 사용하면 리렌더링이 돼도 처음 선언 시 할당한 값으로 초기화되는 것이 아니라 마지막에 .current를 통해 할당한 값이 계속 유지되고, 그냥 변수를 사용하면 리렌더링이 될 때마다 처음 선언 시 할당한 값으로 계속 초기화되기 때문임을 알 수 있었다.


Written by정선아
🌱 공부한 것을 기록하여 성장하기 위한 블로그입니다.

GitHubGmail