2025년 가장 많이 출제되는 자바스크립트 인터뷰 질문 요약
카테고리
프로그래밍/소프트웨어 개발
서브카테고리
웹 개발
대상자
자바스크립트 개발자 및 인터뷰 준비자
- 초보자 및 중급자 대상
- 핵심 개념 이해 및 실전 적용 중심
핵심 요약
- 변수 선언 키워드
var,let,const의 차이점은 범위(스코프), 호이스팅, 재선언 가능 여부로 구분 - 클로저는 외부 함수의 변수를 내부 함수가 참조하는 메커니즘으로, 데이터 캡슐화, React 훅 등에 활용
==vs===비교 연산자에서===는 타입과 값 모두 일치해야 하며,==는 타입 변환 후 비교하여 오류 유발 가능async/await는 비동기 코드를 동기처럼 작성 가능하며, 예외 처리와 가독성 향상에 유리undefined,null,NaN은 각각 초기화되지 않은 변수, 의도적 비값, 수학적 오류 결과를 의미
섹션별 세부 요약
1. `var`, `let`, `const` 차이점
var: 함수 스코프, 호이스팅 시undefined초기화, 재선언 가능let: 블록 스코프, 호이스팅 시 Temporal Dead Zone 발생, 재선언 불가능const: 블록 스코프, 선언 시 초기화 필수, 재할당 불가능
2. 클로저(Closure)
- 내부 함수가 외부 함수의 변수를 참조하는 메커니즘
- 데이터 캡슐화, 커링, React 훅 등에 활용
- 예시:
outer()함수가 반환한inner()함수가name변수를 계속 참조
3. `this` 키워드
- 전역 스코프에서
this는 브라우저의window객체를 가리킴 - 객체 메서드 내에서
this는 객체 자체를 가리킴 - 화살표 함수는 렉시컬 스코프의
this를 상속받음 (메서드 내에서this사용 시undefined발생 가능성)
4. `==` vs `===`
==는 타입 변환 후 비교 (예:'5' == 5→true)===는 타입과 값 모두 일치해야 함 (예:'5' === 5→false)- 최선의 실천 방식:
===사용으로 예기치 않은 오류 방지
5. Promise 및 `async/await`
Promise는 비동기 작업 (API 요청, 파일 읽기)을 관리- 상태: pending, fulfilled, rejected
.then()/.catch()로 비동기 작업 후 조작 가능async/await은 비동기 코드를 동기처럼 작성 가능 (예:await fetch()사용)- 가독성 향상 및 예외 처리 효율성 향상
6. 이벤트 위임(Event Delegation)
- 부모 요소에 하나의 이벤트 리스너를 등록하여 자식 요소의 이벤트 처리
- 메모리 효율성 향상 (다양한 요소에 리스너 추가 대신 단일 리스너 사용)
- 예시:
list요소에click이벤트 리스너 등록 후e.target.nodeName === 'LI'조건 체크
7. `undefined`, `null`, `NaN`
undefined: 선언되었지만 값이 할당되지 않은 변수null: 의도적 비값을 나타냄 (예:let b = null)NaN: 잘못된 수학 연산 결과 (예:'abc' / 2→NaN)
결론
===사용 및async/await활용이 실무에서 필수적- 클로저와 이벤트 위임은 대규모 프로젝트에서 성능 최적화에 효과적
- 변수 스코프 이해와 undefined/null/NaN 구분은 인터뷰에서 핵심 평가 포인트