Organizer 정리 산출물(From_RawData) + 이사 체크리스트 + 인덱스 갱신
- Raw_Data 자동 정리 산출물이 각 도메인 From_RawData/ 로 편입, 00_INDEX 연결 갱신 - 컴퓨터_이사_체크리스트.md 추가 (두뇌-상대 경로 규약 v2.2.304 — 새 컴퓨터에서 바꿀 절대 경로는 localBrainPath 1개) - Astra 세션 산출물(에피소드 기억·기능 인벤토리) 갱신 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Antigravity Agent
@@ -0,0 +1,117 @@
|
||||
---
|
||||
id: execution-context
|
||||
title: "Execution Context"
|
||||
category: "Frontend"
|
||||
status: "draft"
|
||||
verification_status: "conceptual"
|
||||
canonical_id: ""
|
||||
aliases: ["실행 컨텍스트", "JS Execution Context", "자바스크립트 실행 컨텍스트"]
|
||||
duplicate_of: ""
|
||||
source_trust_level: "A"
|
||||
confidence_score: 0.95
|
||||
created_at: 2026-07-11
|
||||
updated_at: 2026-07-11
|
||||
review_reason: ""
|
||||
merge_history: []
|
||||
tags: ["research", "context 이해 규칙"]
|
||||
raw_sources: ["Execution Context 실행 컨텍스트를 알아야하는 이유? - 넥스트리", "JavaScript Execution Context – How JS Works Behind the Scenes - freeCodeCamp"]
|
||||
applied_in: []
|
||||
github_commit: ""
|
||||
---
|
||||
|
||||
# [[Execution Context]]
|
||||
|
||||
## 🎯 한 줄 통찰 (One-line insight)
|
||||
실행 컨텍스트(Execution Context)는 자바스크립트 엔진이 코드를 평가하고 실행하기 위해 필요한 모든 식별자, 스코프, 환경 정보를 담고 관리하는 핵심 구동 환경이다.
|
||||
|
||||
## 🧠 핵심 개념 (Core concepts)
|
||||
* **생성 단계(Creation Phase)와 실행 단계(Execution Phase):** 코드를 실행하기 전 메모리를 할당하고 스코프 체인을 설정하는 단계와, 실제로 코드를 위에서부터 아래로 읽으며 값을 할당하고 실행하는 단계로 나뉜다.
|
||||
* **전역 및 함수 실행 컨텍스트:** 스크립트가 처음 실행될 때 생성되는 전역 실행 컨텍스트(Global Execution Context)와 함수가 호출될 때마다 생성되는 함수 실행 컨텍스트(Function Execution Context)가 있다.
|
||||
* **Variable Environment & Lexical Environment:** 실행 컨텍스트 내에서 식별자와 함수 선언을 저장하는 `environmentRecord`와 상위 스코프를 참조하는 `outerEnvironmentReference`로 구성되는 환경 정보이다.
|
||||
* **콜 스택(Call Stack):** 활성화된 모든 실행 컨텍스트의 순서와 흐름을 추적 및 제어하기 위해 자바스크립트 엔진이 사용하는 자료 구조이다.
|
||||
|
||||
## 🧩 추출된 패턴 (Extracted patterns)
|
||||
* **호이스팅(Hoisting) 패턴:** 함수 내 코드가 실행되기 전(생성 단계)에 현재 컨텍스트에 관련된 모든 식별자 정보(변수명, 함수 선언 등)를 수집하여 메모리에 먼저 저장함으로써, 선언 이전에 접근 시 오류 대신 `undefined`나 함수 자체를 반환하게 되는 메커니즘.
|
||||
* **스코프 체인(Scope Chain) 탐색 패턴:** 현재 컨텍스트의 Lexical Environment에서 변수를 찾지 못하면 `outerEnvironmentReference`를 통해 상위 스코프의 Lexical Environment를 재귀적으로 탐색하여 변수를 찾는 구조적 패턴.
|
||||
|
||||
## 📖 세부 내용 (Details)
|
||||
* **자바스크립트 엔진의 코드 실행 준비:** 자바스크립트는 싱글 스레드 인터프리터 언어이며, 엔진이 스크립트 파일을 스캔한 뒤 코드 변환과 실행을 관리하기 위해 '실행 컨텍스트'라는 환경을 생성한다 [S1], [S2].
|
||||
* **컨텍스트의 두 가지 생애 주기:**
|
||||
* **생성 단계(Creation Phase):** 브라우저의 `window`나 Node.js의 `global` 같은 전역 객체를 생성하고, 변수와 함수를 위한 메모리를 설정한다 [S1], [S2]. 이때 변수는 기본적으로 `undefined`로 초기화된다 [S2].
|
||||
* **실행 단계(Execution Phase):** 코드를 위에서 아래로 한 줄씩 순차적으로 실행하며, 변수에 실제 값을 할당하고 함수 호출을 평가한다 [S2].
|
||||
* **실행 컨텍스트의 내부 구조:**
|
||||
* **Variable Environment:** 초기화 시점의 상태를 스냅샷으로 유지하며 변수 및 외부 환경에 대한 정보를 포함한다 [S1].
|
||||
* **Lexical Environment:** 변수 할당 등 코드 실행 중에 발생하는 동적인 변화를 실시간으로 반영한다 [S1].
|
||||
* 두 환경 모두 식별자 정보를 저장하는 `environmentRecord`와 상위 스코프를 추적하는 `outerEnvironmentReference`를 포함한다 [S1].
|
||||
* **콜 스택(Call Stack)을 통한 관리:** 실행 컨텍스트들은 콜 스택에 푸시(Push)되어 관리된다 [S1], [S2]. 전역 컨텍스트가 가장 먼저 깔리고, 함수가 호출될 때마다 새로운 함수 실행 컨텍스트가 최상단에 쌓인다 [S1], [S2]. 함수 실행이 종료되면 해당 컨텍스트는 팝(Pop)되어 삭제되며, 재귀 함수 등에 의해 콜 스택의 고정된 크기 한도를 초과하면 스택 오버플로우(Stack overflow) 에러가 발생한다 [S2].
|
||||
* **this 바인딩:** 실행 컨텍스트 활성화 시점에 함수가 어떻게 호출되었는지(일반 호출, 메서드 호출, 생성자 호출, 명시적 바인딩)에 따라 `this` 식별자가 가리키는 객체가 연결된다 [S1].
|
||||
|
||||
## ⚖️ 모순 및 업데이트 (Contradictions & updates)
|
||||
* 기본적으로 전역 실행 컨텍스트에서 일반 함수 호출 시 `this`는 전역 객체를 가리키지만, '엄격 모드(strict mode)'가 활성화된 환경에서는 `this` 바인딩이 `undefined`로 설정된다 [S1].
|
||||
|
||||
## 🛠️ 적용 사례 (Applied in summary)
|
||||
현재 발견된 실제 적용 사례(구체적인 프로젝트 파일 경로나 Git 커밋 해시 등)가 없습니다.
|
||||
|
||||
## 💻 코드 패턴 (Code patterns)
|
||||
```javascript
|
||||
// 자바스크립트 실행 컨텍스트와 호이스팅 및 스코프 체인을 보여주는 예시
|
||||
let greeting = "Hello"; // 전역 컨텍스트에 기록됨
|
||||
|
||||
function petInfo() {
|
||||
// petInfo 함수 실행 컨텍스트 생성 (생성 단계 -> 실행 단계)
|
||||
let cat = "cat";
|
||||
let dog = "dog";
|
||||
|
||||
// 자신의 LexicalEnvironment에서 cat, dog를 찾고,
|
||||
// outerEnvironmentReference를 통해 상위(전역) 스코프에서 greeting을 찾음
|
||||
console.log(greeting, cat, dog);
|
||||
}
|
||||
|
||||
petInfo(); // Call Stack에 petInfo 실행 컨텍스트 푸시, 완료 후 팝
|
||||
```
|
||||
*(언어: JavaScript, 버전: ES6+ 기준)*
|
||||
|
||||
## ✅ 검증 상태 및 신뢰도
|
||||
- **상태:** draft
|
||||
- **검증 단계:** conceptual
|
||||
- **출처 신뢰도:** A
|
||||
- **신뢰 점수:** 0.95
|
||||
- **중복 검사 결과:** 신규 생성 (New discovery)
|
||||
|
||||
## 🔗 관련 문서 링크 (Related document links)
|
||||
|
||||
### 상위/유사 개념
|
||||
- [[Call Stack]] — 실행 컨텍스트의 순서와 생명주기를 물리적으로 관리하는 메모리 구조.
|
||||
- [[Lexical Environment]] — 실행 컨텍스트 내부에서 식별자와 스코프를 실시간으로 저장/관리하는 핵심 객체.
|
||||
- [[Hoisting]] — 생성 단계에서 environmentRecord에 식별자가 미리 저장되면서 발생하는 언어적 특징.
|
||||
- [[Scope Chain]] — outerEnvironmentReference를 통해 상위 컨텍스트의 변수에 접근하는 논리적 탐색 메커니즘.
|
||||
|
||||
### 심층 후속 질문 (Deeper Research Questions)
|
||||
- 자바스크립트 엔진의 이벤트 루프(Event Loop)는 콜 스택 및 실행 컨텍스트와 어떻게 상호작용하며 비동기 처리를 수행하는가?
|
||||
- Variable Environment와 Lexical Environment는 구체적으로 어떤 기준에 의해 분리되어 동작하는가?
|
||||
- 'strict mode' 도입 외에 현대 자바스크립트(ES6+) 모듈 환경에서 전역 실행 컨텍스트의 `this` 바인딩은 어떻게 달라지는가?
|
||||
- 클로저(Closure)는 파괴된 상위 함수 실행 컨텍스트의 Lexical Environment를 어떻게 메모리에 유지시키는가?
|
||||
- 운영체제 수준의 'Context Switching'과 자바스크립트의 'Execution Context' 전환은 성능 및 오버헤드 측면에서 어떤 차이가 있는가?
|
||||
|
||||
### 실무 적용 맥락 (Practical Application Contexts)
|
||||
- **Implementation:** 비동기 콜백이나 프로미스 체이닝 작성 시, 스코프와 `this` 바인딩 유지를 위한 화살표 함수(Arrow Function) 활용.
|
||||
- **System Design:** 전역 변수 오염을 최소화하고 메모리 누수(Memory Leak)를 방지하기 위한 모듈 및 클로저 기반의 상태 관리 설계.
|
||||
- **Operation / Maintenance:** 콜 스택 오버플로우 추적 및 디버깅 시, 브라우저 개발자 도구의 Call Stack 패널을 통한 실행 컨텍스트 계층 분석.
|
||||
- **Learning Path:** 자바스크립트의 비동기 메커니즘, 스코프, 클로저, 호이스팅을 심도 있게 이해하기 위한 필수 선행 개념으로 학습.
|
||||
|
||||
### 인접 주변 주제 (Adjacent Topics)
|
||||
- [[Context Switching (OS)]] — 자원을 공유하는 OS 관점에서 프로세스/스레드의 상태를 저장하고 복원하는 메커니즘적 비교.
|
||||
- [[Closure]] — 상위 실행 컨텍스트가 종료되었음에도 해당 환경의 변수에 계속 접근할 수 있게 해주는 기능.
|
||||
- [[Event Loop]] — 싱글 스레드 환경에서 실행 컨텍스트 처리가 완료된 후 비동기 콜백을 콜 스택으로 푸시하는 메커니즘.
|
||||
|
||||
## 🔗 지식 그래프 (Knowledge Graph)
|
||||
- **상위/루트:** [[context 이해 규칙]]
|
||||
- **관련 개념:** [[Call Stack]], [[Lexical Environment]], [[Hoisting]]
|
||||
- **참조 맥락:** 프론트엔드 자바스크립트 환경에서 비동기 코드, 스코프, 클로저 관련 디버깅 및 설계 원칙을 수립할 때 참조됨.
|
||||
|
||||
## 📚 출처 (Sources)
|
||||
- [1] Execution Context 실행 컨텍스트를 알아야하는 이유? - 넥스트리
|
||||
- [2] JavaScript Execution Context – How JS Works Behind the Scenes - freeCodeCamp
|
||||
|
||||
## 📝 변경 이력 (Change history)
|
||||
- 2026-07-11: Initial draft generated via Datacollector_MAC P-Reinforce engine.
|
||||
Reference in New Issue
Block a user