반응형 리액트3 [프론트엔드] React의 불변성 / 얕은비교 Question : 불변성이 무엇인지 설명하시오 Answer : 리액트에서 불변성(immutability)은 상태를 직접 수정하지 않고, 상태 변경 시 새로운 객체를 생성하는 개념입니다. 이는 성능 최적화와 예측 가능한 상태 관리를 위해 중요합니다. 상태나 props가 변경되면 새로운 객체가 생성되어, 리액트는 얕은 비교(shallow comparison)를 통해 이전 상태와 새로운 상태의 참조값을 비교합니다. 참조값이 다르면 리렌더링을 수행하고, 같으면 생략하여 불필요한 리렌더링을 방지합니다. 불변성을 유지하면 코드의 안정성과 유지보수성이 향상되며, 디버깅이 용이해집니다. Question : React 불변성을 유지해야 하는 이유를 설명하시오 Answer : 리액트에서 불변성을 유지하는 이유는 성.. 2024. 5. 22. [프론트엔드] React hooks / 클래스형 컴포넌트 / 함수형 컴포넌트 Question : React hooks에 대해 설명하시오 Answer : React Hooks는 함수형 컴포넌트에서 상태(state)와 생명주기(lifecycle) 기능을 사용할 수 있게 해주는 함수들입니다. 대표적인 Hooks에는 useState, useEffect, useContext 등이 있습니다. useState는 상태 변수를 선언하고 관리할 수 있게 해주며, useEffect는 컴포넌트의 사이드 이펙트(side effects)를 처리할 수 있게 합니다. 이를 통해 클래스형 컴포넌트 없이도 상태 관리와 생명주기 메서드를 활용할 수 있어 코드의 가독성과 유지보수성이 향상됩니다. 또한, 커스텀 훅을 만들어 재사용 가능한 로직을 추출하고 공유할 수 있습니다. Hooks는 React 16.8에서 도입.. 2024. 5. 21. [프론트엔드] React - Virtual DOM / Reconciliation / Diffing / key Question : React Virtual DOM 에 대해 설명하시오 Answer : 리액트의 Virtual DOM은 실제 DOM과 동일한 구조를 메모리 상에 가상으로 구현한 것입니다. 이 가상 DOM은 애플리케이션의 UI 상태를 나타내며, 실제 DOM과는 별도로 관리됩니다. 상태 변경 시, 리액트는 가상 DOM과 이전 가상 DOM을 비교(diffing)하여 변경된 부분만을 감지하고, 실제 DOM에 반영합니다. 이를 통해 불필요한 DOM 조작을 최소화하고 성능을 향상시킵니다. 이는 특히 대규모 애플리케이션에서 UI 업데이트의 효율성을 높여줍니다. Question : Reconciliation 에 대해 설명하시오 Answer : Reconciliation(재조정)은 React에서 Virtual DO.. 2024. 5. 13. 이전 1 다음 반응형