프론트엔드 개발자 면접 질문 #2

* 본 포스팅은 https://sunnykim91.tistory.com/121 블로그의 정보와 구글링을 통해 작성된 글입니다.

---

자바스크립트 타입

• 자바스크립트의 Number Type은 다른 언어들과 차이점이 무엇인가, 왜 하나만 존재하는가?
  
  다른 언어에는 int, double 등 숫자타입의 다양함이 있지만, number는 하나만 있다.
  정수만을 위한 타입이 없고, 모든 수를 실수로 처리한다.
• 자바스크립트의 원시 타입은 몇가지인가? 종류는?
  
  boolean, string, number, undefined, null, symbol 이렇게 6가지 종류가 있다.
  undefined는 선언만 되어있고 값은 없는 상태이며, null은 자료형이 객체이며 빈 값을 의미한다.

---

실행 컨텍스트 (Execution Context)란?

• 자바스크립트의 코드들이 실행되기 위환 환경이다.
• 전역 컨텍스트와 함수 컨텍스트 2가지가 존재한다.
• 전역 컨텍스트 생성 후에 함수가 호출할 때마다 함수 컨텍스트가 생성된다.
• 컨텍스트 생성 시 변수객체, 스코프 체인, this가 생성된다.
• 컨텍스트 생성 후 함수에 사용되는 변수들은 변수 객체 안에서 값을 찾고,
  없다면 스코프 체인을 따라 올라가며 찾는다.
• 함수 실행이 마무리 되면 해당 컨텍스트는 사라지고, 페이지가 종료되면 전역 컨텍스트 사라진다.

즉 JS의 코드가 실행되기 위해서는 변수객체, 스코프체인, this 정보들을 담고 있는 곳을 실행컨텍스트라고 한다.

---

자바스크립트의 호이스팅 (Hoisting)은 어떻게 이루어져 있는가?

• 호이스팅이란 변수를 선언하고 초기화 했을 때 선언부분이 최상단으로 끌어올려지는 현상이다.
• 함수의 경우 함수표현식은 호이스팅이 적용되지 않으나, 일반 함수 선언문은 함수 호이스팅이 적용된다.

예시 코드

console.log(a);

var a = 1;

// 결과는 undefined라고 나온다.
// 이런 현상을 호이스팅이라고 한다.

---

클로저(Closure)란 무엇이며, 왜 이러한 패턴을 사용하는가?

 

클로저란?

• 자신이 생성될때의 환경을 기억하는 함수

클로저를 사용하는 이유?

• 현재 상태를 기억하고, 변경된 최신 상태를 유지하기 위해.
• 전역 변수의 사용을 억제 하기위해.
• 정보를 은닉하기 위해.
• 실수를 줄이기 위해.

---

가비지컬렉터의 역할은? 어떻게 동작하는가?

 

가비지컬렉터의 역할

• 메모리 할당을 추적하고, 할당된 메모리 영역이 필요하지 않은 영역일 경우를 판단해서 회수한다.

어떻게 동작하는가?

JS에서 변수는 직접적으로 참조 값(문자열, 객체, 배열 등)을 담고 있지 않고, 해당 값을 메모리 상에 저장 된다.

                                                                      👇

참조 값을 생성하고나서 더 이상 참조할 것이 없거나 비어졌을 때 가비지컬렉터가 동작해서 메모리가 반환된다.
(메모리를 다시 재사용할 수 있는 상태가 된다.)

---

프로토타입이란?

자바스크립트는 프로토타입을 기반으로 상속을 구현하여 불필요한 중복을 제거한다(기존의 코드를 재사용한다.)

즉, 생성자 함수가 생성할 모든 인스턴스가 공통적으로 사용할 프로퍼티나 메소드를 프로토타입에 미리 구현해 놓음으로써, 상위(부모) 객체인 프로토타입의 자산을 공유하여 사용할 수 있다.

__proto__ 접근자 프로퍼티

• 자신의 프로토타입, 즉 Prototype 내부슬롯에 접근 할 수 있다.

프로토타입체인?

• 객체의 프로퍼티에 접근하려고 할 때 객체에 접근하려는 프로퍼티가 없으면,__proto__ 접근자 프로퍼티가 
  가리키는 링크를 따라 자신의 부모역할을 하는 프로토타입의 프로퍼티를 순차적으로 검색한다.
• 프로토타입체인의 최상위 객체는 Object.prototype이다.
• 이 객체의 프로퍼티와 메소드는 모든 객체에게 상속된다.

prototype 프로퍼티?

• 생성자함수가 생성할 인스턴스의 프로토타입을 가르킨다.

---

프론트엔드 개발자 면접 질문 #2가 끝났습니다.

 

위 내용들 외에 함수 바인딩(This), ES6 등 JS에 관한 지식이 포스팅 되어 있으니 다른 글들도 참조하시는 것을 추천드립니다.

• JavaScript 함수 바인딩
• JavaScript CommonJS, ES6 모듈 시스템

제가 면접을 준비하면서 학습했던 내용들도 포스팅 할 예정이니 기다려주세요!

 

해당 글에서 아래와 같은 내용을 다룰 예정입니다.

• React란?
• React의 LifeCycle
• 반응형 웹 디자인과 적응형 웹 디자인
• 함수형 프로그래밍

프론트엔드 개발자 면접을 보시는 신입 개발자 분들에게 많은 도움이 되었으면 좋겠습니다.

 

혹여나 틀린 부분이 있다면 댓글로 남겨주세요! 바로바로 정확한 정보를 기재하겠습니다.

 

오늘도 긴 글 읽어주셔서 감사합니다😃