프론트엔드 기술 면접 질문 리스트(라**)

Q. javascript 에서 var, let, const 의 차이가 뭐라고 생각하시나요?

A. 3가지 다 변수선언 방식입니다. 

 

var 의 경우 함수스코프를 가집니다. 

var로 선언된 변수의 경우 함수내에서 유효하며 블록 스코프를 가지지 않습니다.

그래서 if, for 문에 선언하더라도 바깥에서 접근할 수 있습니다.

 

또한 var함수의 경우 재사용이 가능합니다.

위에 var x라고 선언하였더라도 바로 아랫줄에 var x 의 다른값을 넣으면 재할당이 가능합니다.

이러한 이유로 요즘에는 var 보다 const 를 더 많이 사용합니다.

 

그리고 var의 경우 호이스팅이 됩니다. 호이스팅이 되면 선언된 함수가 최상단으로 올라옵니다.

하지만 선언만 되는것이며 할당이 된것이 아니라 undefined로 초기화 되어 만약 출력을 먼저 하게된다면 lundefined 가 출력됩니다.

 

Let 함수의 경우는 블록스코프 방식입니다. 

만약 if 문이나 for문과 같은 블록내에서 선언된다면 밖에서는 접근이 불가능합니다. 

또한 재할당은 가능합니다. 

호이스팅이 되기는 하지만 변수가 초기화 되지 않습니다.(참조오류 발생)

 

const 의 경우 재할당 재선언이 불가능 합니다.

const 의 경우도 블록스코프 방식입니다. 

if for 문 내에서 선언되면 밖에서 접근 불가능합니다. 

호이스팅이 되기는 하지만 변수가 초기화 되지 않습니다.(참조오류 발생)

 

 

Q . react 의 virtual dom 에 대해 설명해주세요.

 

A . react 의 vitual dom 의 경우 메모리상의 가벼운 javascript의 객체로 실제 dom의 추상적인 표현입니다.

실제 Dom은 웹페이지의 구조를 표현하는 객체 모델이면 HTML 문서를 트리구조로 표현합니다.

브라우저는 Dom을 기반으로 웹페이지를 렌더링하고 javascript 를 통해서 dom을 조작하는데 비용이 많이 드는 작업이다 보니 react 에서는 virtual dom 을 활용해서 저렴한 비용으로 작업합니다.

 

react의 컴포넌트 상태가 바뀌면 react는 새로운 virtual dom을 생성하며

이전 virtual dom과 새 virtual dom을 비교해 차이점을 찾고.

차이가 있는 부분만 업데이트를합니다.

 

이렇다 보니 효율정이 렌더링이 가능하며 성능이 향상됩니다.

또한 코드의 유지봏수성이 확장됩니다.

 

 

 

Q. 화살표 함수에서 this 는 뭘 의미하나요?

 

A. 화살표 함수에서 this는 일반 함수와 다르게 작동합니다. 

자신만의 this를 가지지 않고 상위스코프에서 this 값을 자동으로 바인딩 합니다.

this 는 화살표 함수가 선언된 위치의 this 를 따릅니다.