전체 글67 [프론트엔드 기술면접] React의 state와 props React의 state와 props에 대해서 설명해주세요. 리액트의 stste는 컴포넌트의 상태를 관리하는 객체입니다. useState훅을 사용하여 state를 만들고, setState를 사용하여 값을 변경하면 컴포넌트가 리렌더링됩니다. props는 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달하는 것들을 의미합니다. props로 넘겨준 값들은 불변하며, readOnly(읽기전용)속성을 가지고있습니다. 따라서 자식 컴포넌트에서의 직접적인 props 변경은 불가하며, 내려받은 setState나 함수를 이용하여 props를 바꾸도록 부모 컴포넌트에게 요청할 수 있습니다. 꼬리질문 왜 변수가 아닌 state에 데이터를 저장하나? 변수값이 바뀌었을 때 일반 변수는 리렌더링이 되지 못하지만, state에 저장된.. 2023. 7. 28. [프론트엔드 기술면접] 순수함수란? 불변성과 사이드 이펙트와 연결 순수함수란 무엇인가요? 불변성과 사이드 이펙트와 연결하여설명해주세요. 순수함수란 동일한 입력값이 주어지면 항상 동일한 출력값을 반환하는 함수로, 외부상태에 의존하지도, 변경시키지도 않는, 즉 사이드 이펙트가 없는 함수를 의미합니다. 순수함수는 입력값만을 가지고 처리하기 때문에 입력값이 변경되지 않는 한 항상 같은 결과를 반환하므로 불변성을 유지합니다. 자바스크립트에서 순수함수를 제작하기 위해서는 데이터의 불변성을 유지하는 것이 중요한데, 함수의 전달인자로 참조 자료형이 전달되는 경우 객체 자체를 바꾸는 사이드이펙트가 생길 수 있고, 이는 해당 데이터의 불변성을 손상시키게 됩니다. 따라서 배열의 불변성을 보존하는 map, filter, reduce 등의 메소드를 많이 사용합니다. 2023. 7. 28. [프론트엔드 기술면접] Cookie의 MaxAge, Expires Cookie의 MaxAge, Expires 옵션이 무엇인지, 설정하지 않으면 어떻게 되는지 설명해주세요. 쿠키는 웹 브라우저 상에 작은 텍스트파일로 저장이 되는 만료기간이 존재하는 저장소입니다. Maxage와 Expires는 쿠키의 유효기간을 설정하는 속성입니다. MaxAge는 쿠키가 유지될 시간을 초 단위로 설정합니다. 쿠키가 생성된 후 입력한 시간동안 쿠키가 유효할 수 있게 만들 수 있습니다. Expires는 쿠키의 만료 일자를 GMT포맷으로 설정하여 쿠키의 수명을 제어합니다. MaxAge와 Expires 옵션 중 하나라도 설정하지 않으면? MaxAge와 Expires 옵션 중 하나라도 설정하지 않으면, 쿠키가 브라우저 세션 중에만 유지되고, 브라우저가 종료되면 쿠키가 자동으로 삭제된다. 이를 'Se.. 2023. 7. 27. [프론트엔드 기술면접]useRef가 필요한 상황 useRef가 필요한 상황을 예시를 들어 설명해주세요 useRef의 객체 참조 특징 useRef는 ReactHocks 중 하나로, 하나의 객체 안에서 .current를 통해서 데이터를 관리합니다. 결국 내부의 값이 변하더라도 참조형 데이터의 특성상 주소값은 변하지 않아 변경사항을 감지하지 못하기 때문에 리렌더링 하지 않게 됩니다. 필요한 상황 1. useRef로 컴포넌트 안의 변수 관리 컴포넌트 안에서 조회 및 수정 가능한 변수를 관리할 수 있습니다. useRef로 변수를 관리하게 되면 변수가 업데이트 된다고 해서 컴포넌트가 리렌더링 되지 않는다. 굳이 리렌더링 할 필요가 없는 변수라면 useRef로 관리 해 주는 것이 효율적이다. setTimeout, setInterval을 통해 만들어진 id scro.. 2023. 7. 27. 이전 1 2 3 4 5 ··· 17 다음