코드스테이츠

기술면접 준

diary owner 2022. 10. 19. 10:44

JavaScript

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

브라우저 렌더링

  • 브라우저 렌더링 방식에 대해 설명하세요.
  • 리플로우와 리페인트에 대해 설명하세요.
  • 반응형 웹은 무엇이고 장단점에 대해 설명하세요.
  • 자바스크립트 엔진의 콜 스택이 무엇인지 설명할 수 있나요?

번들링과 웹팩

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

   

번들링이 왜 필요한가요?

번들이란 묶는다는 뜻으로 뭔가를 묶는 작업이라는 것을 이름에서 유추할 수 있습니다. 

번들링이란 모듈들의 의존성 관계를 파악하여 그룹화시켜주는 작업을 뜻합니다. 모듈이란 분리된 파일입니다.

 

그렇다면 파일을 모듈로 분리한 이유는 무엇일까요? 그것은 작업의 효율성을 위해서입니다. 스크립트의 크기가 점점 커지고 복잡해지면서 단순히 하나의 파일이나 클래스로만 관리하기에는 그 복잡하기 때문입니다. 그렇기 때문에 머리, 가슴, 팔, 다리를 따로 떼어서 모듈로서 작업을 할 필요가 생겼습니다.

 

분리된 모듈들은 연계성을 띄어야하기 때문에 모듈 내부에는 import로 외부 모듈의 기능을 가져오고 export로 외부 모듈에서의 접근을 허용하여 모듈의 기능을 내보냅니다.

 

모듈 import와 export 외에도 번들링이 필요한 이유는 여러개의 파일을 브라우저에서 로딩한다면 네트워크가 그만큼 소모되어 속도가 저하 될 수 있고 모듈 간의 변수 충돌 등의 위험성이 존재하기 때문입니다.

 

번들러(bundler)란, 웹 애플리케이션을 구성하는 모든 자원을 하나의 파일로 묶는 도구를 의미합니다.

번들러를 사용하게 되면, 아래와 같은 장점등을 얻습니다.

1. 모듈 단위의 코드 작성

2. 네트워크 병목 완화 (최적화)

3. 웹 개발 작업 자동화

 

React

  • Virtual DOM이 무엇이고, Virtual DOM이 어떤 면에서 좋은가요?
  • Class Component와 Function Component의 차이점이 무엇인가요?
  • React Hook의 사용 규칙에 대해 설명하세요.

운영체제

  • Node.js는 싱글 스레드인가요?
  • JavaScript는 싱글 스레드입니다. 어떻게 싱글 스레드 방식으로 비동기 호출을 할 수 있는 지에 대해 설명할 수 있나요?
  • Event Loop에 대해 설명할 수 있나요?
  • 가비지 컬렉션이란 무엇이며, 가비지 컬렉션을 가진 언어에는 무엇이 있나요?

자료구조

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

스택(stack)이란 쌓아 올린다는 것을 의미한다.

따라서 스택 자료구조라는 것은 책을 쌓는 것처럼 차곡차곡 쌓아 올린 형태의 자료구조를 말한다.

 

📌 스택의 특징

스택은 위의 사진처럼 같은 구조와 크기의 자료를 정해진 방향으로만 쌓을수 있고,

top으로 정한 곳을 통해서만 접근할 수 있다.

top에는 가장 위에 있는 자료는 가장 최근에 들어온 자료를 가리키고 있으며,

삽입되는 새 자료는 top이 가리키는 자료의 위에 쌓이게 된다.

스택에서 자료를 삭제할 때도 top을 통해서만 가능하다.

스택에서 top을 통해 삽입하는 연산을 'push' , top을 통한 삭제하는 연산을 'pop'이라고 한다.

 

따라서 스택은 시간 순서에 따라 자료가 쌓여서 가장 마지막에 삽입된 자료가 가장 먼저 삭제된다는

구조적 특징을 가지게 된다.

 

이러한 스택의 구조를 후입선출(LIFO, Last-In-First-Out) 구조이라고 한다.

  • Tree와 Graph의 차이점은 무엇인가요?
  • 이진 탐색 방법에 대해 설명할 수 있나요?