개발자
자바스크립트와 리액트를 현재 공부하고 있는 중인데 변수인 let, const에 대한 부분과 리액트에서 useState에 대한 부분의 설명을 듣고 문법적인 부분은 이해는 했는 상황인데 제가 직접 혼자 코드를 작성을 해보려고 하니 변수와 useState를 어떨때 작성을 하면 되는지 감이 잘 오지 않더라구요. 그래서 혼자 코드를 작성을 할 때 이럴때 변수 또는 useState를 작성하면 되겠구나하고 정말 쉽게 이해할 수 있는 방법이 있을까요? 있다면 쉽게 설명해주시면 너무 감사드리겠습니다.
답변 2
안녕하세요. 저 같은 경우는 UI에서 사용하는 변수이지만 그 값이 바뀔 때 마다 화면의 변화가 있어야한다면 state로 사용합니다. 예를 들어 count라는 값을 UI에 뿌려주고 싶다면 useState를 사용합니다. 변수로 선언하게 되면 count 값이 바뀔 때 마다 재랜더링이 되지는 않습니다.
익명
작성자
2024년 06월 03일
답변주셔서 감사드립니다. 쉽게 설명해주셔서 바로 이해가 되었습니다 ^^
지나가다 답변달고갑니다 ㅎㅎ useState는 동적인 값을 제어하기 위해 쓰입니다. 예를 들어 메뉴 on/off 버튼을 만들기 위해선 아마 이런 변수를 선언하게 될 것입니다. const [isOn, setIsOn]= useState(false); isOn의 값이 true 이면 메뉴기능 on isOn의 값이 false 이면 메뉴 기능 off onClick={()=>setIsOn(!isOn)} << 해당 버튼을 누르면 해당 state의 값이 true와 false 를 왔다갔다 하며 메뉴기능이 on/off 되겟죠? 개발 중엔 이러한 동적인 값을 다루는 일이 정말 많습니다. useState는 이를 쉽게 제어하기 위해 리엑트에서 제공해주는 것이죠. 실무에서는 서버에서 보내주는 데이터를 변수에 저장할 때 가장 자주 쓰입니다. 예를 들어 게시판 데이터를 불러왔을 때, 서버에서 보내준 게시판의 제목, 내용, 태그들의 값으로 변수가 재할당 됩니다.
익명
작성자
2024년 06월 03일
이해하기 쉽게 설명해주셔서 너무 감사드립니다 ^^
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
커리어리 AI 봇
GPT가 달아주는 답변입니다.
2024년 06월 03일
변수는 프로그래밍에서 데이터를 저장하고 그 이름을 통해 참조하거나 수정하는데 사용됩니다. JavaScript에는 var, let, const 세 가지 변수를 선언하는 방법이 있습니다. - `var`: 함수 레벨 스코프를 가진 변수로서, 현재 많이 사용되지 않습니다. - `let`: 블록 레벨 스코프를 가지며, 재할당 가능한 변수입니다. - `const`: 블록 레벨 스코프를 가지며, 한 번 할당되면 변경할 수 없는 상수입니다. 변수를 어떻게 사용할 것인가에 따라 적절한 타입을 선택합니다. 예시로, 변하지 않을 값을 선언한다면 `const`를 사용하고 값이 계속 변경되는 경우라면 `let`을 사용합니다. React의 useState는 컴포넌트에서 상태를 관리하는 Hook 입니다. useState Hook은 컴포넌트 내에서 가변적인 상태를 추가할 수 있게 해줍니다. 변수와 달리 state는 컴포넌트가 리렌더링 될 때 값을 유지하며, 값이 바뀔 경우 React가 이를 감지하고 해당 컴포넌트와 그 자식들을 다시 그립니다. 예시로, 동적으로 데이터가 바뀌어야 하는 UI (예: 버튼 클릭 카운터, 텍스트 입력 등)를 다루는 경우에 useState를 사용하면 됩니다. 또한 API로부터 데이터를 가져와 화면에 보여주고 업데이트 해야하는 경우에도 useState를 사용합니다. 즉, 간단히 말하자면 변하지 않는 값은 변수로 선언하고, 사용자 상호작용이나 시간의 경과 등으로 동적으로 변경되어야 하는 값을 다룰 때는 state를 사용하는 것이 좋습니다. 이렇게 구분하시면서 코딩을 진행해보시면 변수와 state의 용도와 차이점을 체감할 수 있으실 겁니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!