const products&nbsp;=&nbsp;result.data.products;
를 사용하여데이터를 추출하고&nbsp;&nbsp;
products.map(function&nbsp;(product,&nbsp;index)
을 실행하였을 때&nbsp;
<div style="background-color: #ffffff; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">const&nbsp;[products,&nbsp;setproducts]&nbsp;=&nbsp;React.useState([])</div>
<div style="background-color: #ffffff; font-family: Consolas, 'Courier New', monospace; font-size: 14px; line-height: 19px; white-space: pre;">를 꼭 써줘야 실행이 되는 것은 비동기화 때문에 데이터가 추출되기도 전에 지나가 버리니 사용해 주는 것이 맞나요?</div>

넵! 기본적으로 네트워크 통신은 비동기 통신이기에 나중에 데이터를 받게 됐을 때 컴포넌트가 다시 렌더링을 해야지 화면에 반영이 됩니다. 만약 state를 사용하지 않으면 데이터를 받게되어 products 값을 받더라도 products.map이 다시 실행되지 않기 때문에 화면은 계속 비어있게 될 겁니다!
즉 products라는 state가 필요한 이유는 해당 컴포넌트가 렌더링(짜여진 코드를 다시 읽어서 return하는 것)을 다시해주게 하기 위해서입니다!

이걸 어떻게 질문하지 했는데 깔끔하고 이해하기 쉽게 질문해주셔서 감사합니다&nbsp; ^^

인프런 커뮤니티 질문&답변

state 질문입니다.