javascript/모던 자바스크립트 Deep Dive
실행 컨텍스트 ECMAScript 의 소스코드 4가지 타입
yongfront
2024. 2. 2. 12:18
반응형
SMALL
ECMAScript는 자바스크립트의 표준을 정의하는 사양입니다. ECMAScript 사양에서는 소스 코드를 네 가지 주요 타입으로 분류합니다. 이러한 분류는 소스 코드가 어떻게 실행되고 평가되는지에 대한 규칙을 정의합니다. 이 네 가지 타입은 다음과 같습니다:
1. Global Code (전역 코드)
- 전역 코드는 함수나 클래스와 같은 어떠한 실행 가능한 코드 블록에도 둘러싸이지 않은 코드를 의미합니다.
- 이 코드는 전역 스코프에서 실행됩니다.
- 전역 변수나 함수 정의 등을 포함할 수 있으며, 스크립트가 로드될 때 바로 실행됩니다.
var a = 20; // 전역 변수
function foo() {
// 이 함수는 전역 컨텍스트에 정의됨
}
foo(); // 전역 컨텍스트에서 foo 함수 호출
2. Function Code (함수 코드)
- 함수 코드는 함수 내부에 작성된 코드를 가리킵니다.
- 함수 코드는 해당 함수가 호출될 때 실행됩니다.
- 이 코드는 자체적인 실행 컨텍스트를 가지며, 함수의 매개변수와 지역 변수를 포함할 수 있습니다.
function bar(x) {
var y = 10;
return x + y; // 함수 스코프 내의 변수 x와 y
}
bar(20); // 함수 bar가 호출되면서 함수 실행 컨텍스트 생성
3. Eval Code (eval 코드)
- eval 코드는 eval() 함수를 통해 실행되는 코드입니다.
- eval() 함수는 문자열로 된 코드를 동적으로 실행할 수 있게 해줍니다.
- 이 코드는 **eval()**이 호출된 컨텍스트 내에서 실행됩니다.
var z = 1;
function executeEval() {
eval('var z = 2;'); // eval 실행 컨텍스트 내에서 z 정의
return z; // 이 z는 eval 내부의 z
}
executeEval(); // z 값은 2가 됨
console.log(z); // 전역 변수 z의 값은 여전히 1
4. Module Code (모듈 코드)
- 모듈 코드는 ECMAScript 모듈에 포함된 코드를 의미합니다.
- ECMAScript 모듈은 **import**와 export 문을 통해 다른 모듈과 연결될 수 있습니다.
- 모듈은 자체적인 스코프를 가지며, 모듈 내에서 선언된 변수나 함수는 기본적으로 모듈 외부에서 접근할 수 없습니다.
// file1.js
export function testModule() {
return 'Hello from module!';
}
// file2.js
import { testModule } from './file1.js';
console.log(testModule()); // 'Hello from module!' 출력
이러한 분류는 ECMAScript 코드가 다양한 환경(브라우저, Node.js 등)과 상황(전역, 함수 내부, 모듈 등)에서 어떻게 실행되어야 하는지를 명확히 정의하는 데 중요한 역할을 합니다. 이를 통해 개발자들은 자바스크립트 코드를 좀 더 효율적으로 작성하고 관리할 수 있게 됩니다.
728x90
반응형
LIST