Codestates/Section 4

[10/19] 기술면접

Tite 2022. 10. 19. 11:05

JavaScript

  • Hoisting과 Temporal Dead Zone이 어떻게 연관되어 있는지 설명하세요.

=> 호이스팅은 선언되지 않은 함수, 변수를 import 구문으로 상단으로 끌어올려 사용할 수 있게 하는 방식을 뜻합니다.

 

브라우저 렌더링

  • 브라우저 렌더링 방식에 대해 설명하세요.

=> 우선 HTML과 CSS 파일을 파싱해서 각각 DOM tree를 만듭니다. 그 다음 두 tree를 결합해 렌더링 tree를 만들고, 렌더링 tree에서 각 노드의 위치와 크기를 계산합니다. 계산된 값을 이용해 각 노드를 화면상의 실제 픽셀로 변환하고, 레이어를 만듭니다. 그 다음 만들어진 레이어들을 합성하여 실제 화면으로 나타냅니다.

  • 리플로우와 리페인트에 대해 설명하세요.

=> 리플로우와 리페인트는 DOM 요소가 시각적으로 변경되었을 때, 다시 계산하고 화면에 그려주는 역할을 합니다. 리플로우는 발생하는 변화들에 맞춰 다시 계산 작업을 하는 역할을 하고 레이아웃이라고 부르기도 합니다. 리페인트는 다시 계산되어 변경된 요소들을 실제 화면에 그려주는 작업을 합니다. 그러므로 리플로우가 발생하면 필연적으로 리페인트도 따라옵니다.

  • 반응형 웹은 무엇이고 장단점에 대해 설명하세요.

=> 반응형 웹이란 다양한 디바이스 환경에서 원활하게 렌더링되는 웹 페이지를 뜻합니다.

 반응형 웹의 장점은 모든 기기에서 최적화된 웹사이트를 제공할 수 있다는 점, 모바일과 웹사이트 두 가지 버전을 만들지 않아도 되기 때문에 비용, 시간, 인력을 줄일 수 있고 유지보수가 쉽다는 점, 검색엔진 노출이 용이하다는 점이 있습니다. 

 반응형 웹의 단점으론 사용자가 다른 기기로 이용할 생각이 없는데도 모든 기기를 위한 css를 전부 다운로드 해야하기 때문에 데이터를 낭비하고, 로딩 시간이 길어진다는 점이 있습니다.

  • 자바스크립트 엔진의 콜 스택이 무엇인지 설명할 수 있나요?

=> 콜 스택이란 메모리 영역에서 스택 영역에 해당하며, 함수의 호출을 기록하는 스택 자료구조입니다.

 

번들링과 웹팩

  • 번들링은 왜 필요한가요?

=> 번들링은 모듈간의 의존성을 파악해서 그룹화를 시켜주는 작업을 뜻합니다. 여러 개의 파일을 브라우저에서 로딩한다면 속도가 느려지고, 모듈 간의 변수 충돌 등 위험성이 존재하기 때문에 분리되어 있는 파일들을 하나로 묶어주는 번들링 작업이 필요합니다. (난독화 내용 추가) 

 

React

  • Virtual DOM이 무엇이고, Virtual DOM이 어떤 면에서 좋은가요?

=> 버추얼 돔은 가상의 돔 객체로 실제 돔의 가벼운 사본 같은 개념입니다. 돔은 계층적 구조로 되어 있는 트리이기 때문에 저장된 데이터를 효과적으로 탐색하는 것에 초점이 맞춰있습니다. 실제 돔을 조작하는 일은 브라우저에 실제로 그리기 때문에 느리지만, 가상의 돔은 변화 전과 후를 비교하고 바뀐 부분만 적용하기 때문에 훨씬 속도가 빠르다는 장점이 있습니다. 또한 버추얼 돔을 사용하면 실제 DOM은 최소한의 작업만 수행하기 때문에 DOM의 업데이트 비용을 줄일 수 있다는 장점도 있습니다.

  • Class Component와 Function Component의 차이점이 무엇인가요?

=> 

  • React Hook의 사용 규칙에 대해 설명하세요.

=>

 

 

 

운영체제

  • Node.js는 싱글 스레드인가요?

=> 

  • JavaScript는 싱글 스레드입니다. 어떻게 싱글 스레드 방식으로 비동기 호출을 할 수 있는 지에 대해 설명할 수 있나요?

=> 

  • Event Loop에 대해 설명할 수 있나요?

=> 

  • 가비지 컬렉션이란 무엇이며, 가비지 컬렉션을 가진 언어에는 무엇이 있나요?

=>

 

 

자료구조

  • Stack과 Queue의 차이점은 무엇인가요?

=> 

  • Tree와 Graph의 차이점은 무엇인가요?

=> 

  • 이진 탐색 방법에 대해 설명할 수 있나요?

=>