[typescript] 실행 컨텍스트와 호이스팅이 프로토타입 체이닝과 어떤 관계가 있나요?

15 Dec 2023

typescript

호이스팅은 JavaScript 엔진이 코드를 실행하기 전에 변수 및 함수 선언을 모두 “끌어올리는” 동작을 의미합니다. 따라서 선언부가 해당 스코프의 최상단으로 이동하게 되며, 선언 이전에 해당 식별자에 접근하더라도 에러가 발생하지 않습니다.

console.log(myVar); // undefined
var myVar = 10;

3. 프로토타입 체이닝

프로토타입 체이닝은 JavaScript의 객체 간 상속 메커니즘입니다. 객체는 자신의 부모 역할을 하는 프로토타입 객체를 가리키며, 자식 객체에서 속성이나 메소드를 찾을 때 부모 객체로 이동해가며 탐색합니다.

let animal = {
  eats: true
};
let rabbit = {
  jumps: true
};
rabbit.__proto__ = animal; // rabbit은 animal을 상속받습니다.
console.log(rabbit.jumps); // true
console.log(rabbit.eats); // true

4. 실행 컨텍스트, 호이스팅, 그리고 프로토타입 체이닝의 관계

실행 컨텍스트에는 현재 실행 중인 코드와 관련된 변수, 함수, this 등의 정보가 저장됩니다. 호이스팅은 실행 컨텍스트에 포함되어 있으며, 실행 컨텍스트가 형성되면 변수 및 함수 선언이 호이스팅되어 초기화됩니다. 프로토타입 체이닝은 객체의 프로토타입 체인을 따라가며 속성 및 메소드를 검색하는 동작을 수행하며, 이때 실행 컨텍스트와 호이스팅된 변수들이 사용될 수 있습니다.

따라서, 실행 컨텍스트는 호이스팅된 변수 및 함수를 저장하고, 프로토타입 체이닝 시 해당 변수나 함수를 참조할 때 실행 컨텍스트의 정보가 활용됩니다. 이들은 JavaScript의 핵심적인 동작원리로 서로 밀접한 관련이 있습니다.

참고문헌:

“You Don’t Know JS: Scope & Closures” by Kyle Simpson (http://www.kickstarter.com/projects/getify/you-dont-know-js-book-series)

목차

1. 실행 컨텍스트

2. 호이스팅

3. 프로토타입 체이닝

4. 실행 컨텍스트, 호이스팅, 그리고 프로토타입 체이닝의 관계