개발자

react 18에서 use 가 뭔가요?

2022년 11월 09일조회 285

안녕하세요~ react 18을 사용하고 있는데 use() 라는 함수를 많이 사용하더라구요. 주로 외부 API 조회할때 조회하는 함수를 use로 넣어서 사용하는데, 이게 뭐하는 용도인지 궁금합니다.

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 1

손정현님의 프로필 사진

안녕하세요. 생각보다 관련 자료를 찾기 힘들어서 직접 소스코드를 확인해봤는데요. (use라는 단어가 너무 흔해서 검색 결과가 좋지가 않네요ㅠㅠ) https://github.dev/facebook/react/blob/1e3e30dae2bcfbeb0abc686f2a37aec208eedb39/packages/react-reconciler/src/ReactFiberHooks.new.js#L891 이 파일을 참고해보시면 use 함수가 어떤 동작을 하는지 알 수 있습니다. 로직을 조금 살펴보면 Promise 객체인 경우, trackUsedThenable 함수가 작동하는 걸 알 수 있습니다. https://github.dev/facebook/react/blob/1e3e30dae2bcfbeb0abc686f2a37aec208eedb39/packages/react-reconciler/src/ReactFiberThenable.new.js#L98 trackUsedThenable을 또 파보시면, promise의 결과 값을 unwrap하는 것을 보실 수 있습니다. 이것 외에도 다른 작업을 하는 것 같긴하지만 전체를 깊이 있게 확인하지는 않았습니다. 결론은 use() 함수의 경우 Promise 객체를 받게되면 react의 연산 과정 (render, commit) 속에서 여러가지 일을 수행하는데, 그 중 하나가 promise의 결과 값을 unwrap하는 것인 것 같습니다. (물론 제가 틀렸을수도 있습니다 ㅎㅎ) 그래서 단순 await으로 결과 값을 꺼내는 것과 비교했을때, use()를 사용하시면 react 팀이 의도한대로 react의 사이클안에서 작동하게끔 할 수 있는게 다른점인것 같네요.

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!