2024/10/29 2

State(상태)와 Props(속성)

React에서 state와 props는 둘 다 컴포넌트에서 데이터를 다루는 데 사용되지만, 목적과 사용 방법에서 차이가 있다.📖 State컴포넌트 내부에서 관리되는 값으로서 변경 가능이 값은 컴포넌트가 렌더링되는 동안 변할 수 있으며, 변경될 때마다 컴포넌트가 다시 렌더링즉, React에서 state는 컴포넌트 내에서 관리되는 상태 데이터이며, 컴포넌트 내부에서 변경할 수 있고 컴포넌트의 렌더링 결과 결정 장점컴포넌트의 내부 상태를 유지동적인 UI를 구성예) 상태 데이터를 사용하여 사용자 입력에 대한 반응을 보여주거나, 외부 API에서 데이터를 가져와서 화면을 업데이트React의 렌더링 성능을 최적화React는 컴포넌트의 상태가 변경될 때만 렌더링을 다시 수행상태 데이터를 사용하여 불필요한 렌더링을 방..

공부/리액트 2024.10.29

[모던 리액트 Deep Dive] 1장. 리액트 개발을 위해 꼭 알아야 할 자바스크립트

1.1 자바스크립트의 동등 비교더보기더보기의존성 배열에 대한 고민 : 보통 리액트에서 제공하는 eslint-react-config에 선언돼 있는 react-hooks/exhaustive-deps의 도움을 받아 해당 배열을 채우는데, 실제로 이것이 어떤 식으로 작동하는지, 또한 왜 이러한 변수들을 넣어야 하는지 이해하지 못하는 경우가 많음렌더링 관점 : 리액트 컴포넌트의 렌더링이 일어나는 이유 중 하나가 바로 props의 동등 비교에 따른 결과 리액트의 가상 DOM과 실제 DOM의 비교, 리액트 컴포넌트가 렌더링할지를 판단하는 방법, 변수나 함수의 메모이제이션 등 모든 작업은 자바스크립트의 동등 비교를 기반으로 함1.1.1 자바스크립트의 데이터 타입원시타입(primitive type)boolean참과 거짓..