Day-43 인터뷰 질문 및 답변 요약

카테고리

프로그래밍/소프트웨어 개발

서브카테고리

웹 개발, 앱 개발, 개발 툴

대상자

프론트엔드 및 노드.js 개발자, 인터뷰 준비자

난이도: 중급 이상 (기본 개념부터 고급 패턴까지 포함)

핵심 요약

• 함수 선언 vs. 표현식

- function greet()은 호이스팅됨.

- const greet = function()은 호이스팅되지 않음.

• 비동기 처리

- async/await으로 fetch() 사용, 콜백 지옥 방지.

- 이벤트 루프를 통한 타스크 큐 처리.

• 노드.js 특징

- 크롬 V8 엔진 기반, 비동기 I/O 처리, 단일 스레드 이벤트 루프.

섹션별 세부 요약

1. 함수 및 비동기 처리

• 함수 선언과 표현식의 차이점 강조.
• setTimeout() 사용 시 비동기 처리.
• async/await로 비동기 작업을 동기식처럼 처리.

2. 노드.js 기초

• 노드.js는 서버에서 실행되며 DOM API를 사용하지 않음.
• http.createServer()로 서버 구축 예시 제공.
• 비동기 I/O, 이벤트 기반 모델로 확장성 구현.

3. HTTP 메서드

• GET은 데이터 조회, POST은 데이터 전송, PUT은 전체 업데이트, PATCH는 부분 업데이트.
• DELETE는 리소스 삭제, OPTIONS/HEAD는 메타 정보 요청.

4. `this`와 값의 차이

• this의 범위: 객체, 비엄격 모드, 엄격 모드/화살표 함수.
• undefined는 변수 선언 후 값 없음, null은 의도적 값 없음.
• == vs ===: 타입 강제 변환 여부 차이.

5. 성능 최적화

• 이미지 압축, CSS/JS 최소화, CDN 사용, 캐싱, 비동기 로딩.
• Access-Control-Allow-Origin 헤더 설정.

6. 클로저와 CSS 포지셔닝

• 외부 스코프 기억하는 함수: outer() → inner().
• position: relative, absolute, fixed의 차이.
• 미디어 쿼리로 반응형 디자인 구현.

7. 렌더링 방식

• 클라이언트 측 렌더링: 브라우저에서 처리, SEO 불리.
• 서버 측 렌더링: 서버에서 처리, 초기 로딩 빠름.

8. 패키지 관리자 및 버전 컨트롤

• Yarn은 캐싱, 오프라인 기능 우수.
• Git 명령어: branch, merge, pull request, 충돌 해결.

9. 빌드 및 디버깅

• 개발 환경: 디버깅, 소스맵 포함.
• 프로덕션: 최소화, 소스맵 제거.
• DevTools 사용, console.log() 활용.

결론

• 핵심 팁: async/await과 이벤트 루프 개념을 정확히 이해하고, HTTP 메서드의 용도를 구분.
• 실무 적용: 클로저와 this의 범위를 구체적으로 파악하여 오류 방지.
• 인터뷰 준비: const/let/var 차이, 비동기 처리 방식, 성능 최적화 기법을 반복 연습.