컴파일 단계에서 렉시컬 스코프의 지도가 생성되는 과정에서 발생할 수 있는 오류에는 어떤 것이 있나요?

[lledellebell]

관련 챕터

[Part2] 1.6 렉시컬 스코프 (Lexical Scope)

[wogus216]

답변

먼저 렉시컬 스코프의 지도는 JavaScript 엔진이 코드의 각 변수와 함수가 어디에서 선언되고, 어디에서 접근 가능한지를 나타내는 데이터 구조를 생성하는 것을 의미하고, 이과정은 코드가 실행되기전에 이루어짐

컴파일 단계에서 렉시컬 스코프의 지도가 생성될 때 발생할 수 있는 오류는 주로 변수의 선언과 사용과 관련이 있습니다.

1. 변수 재선언 오류: 같은 스코프 내에서 같은 이름의 변수를 다시 선언하려 할때 발생

let x = 10;
let x = 20; // SyntaxError: Identifier 'x' has already been declared

2.변수 참조 오류(ReferenceError): 변수가 초기화되기 전에 접근하려고 할 때 발생합니다. 이는 Temporal Dead Zone (TDZ)에 의해 보호되는 let과 const에 대해 자주 발생합니다.

console.log(x); // ReferenceError: Cannot access 'x' before initialization
let x = 10;

3. 블록 스코프 변수 참조 오류: 블록 스코프 내 변수를 밖에서 접근하려 할 때 발생

if (true) {
  let y = 10;
}
console.log(y); // ReferenceError: y is not defined

4. 사용하지 않는 변수 경고: 변수가 선언되었지만 사용되지 않을 때 발생할 수 있는 경고

5. 상수 재할당 오류: const로 선언된 변수 새 값을 할당하려고 할 때 발생

6. 함수 스코프와 블록 스코프의 혼동: var는 함수 스코프를 가지지만, let과 const는 블록 스코프 이 차이로 인해 예상치 못한 동작이 발생

function example() {
  if (true) {
    var x = 5;
  }
  console.log(x); // 5 (var는 함수 스코프)

  if (true) {
    let y = 10;
  }
  console.log(y); // ReferenceError: y is not defined (let은 블록 스코프)
}

7. 선언되지 않은 변수 사용

8 .함수 호이스팅으로 인한 혼란: 함수 선언은 호이스팅되지만, 함수 표현식은 호이스팅되지 않음

console.log(myFunc()); // "Hello"
function myFunc() {
  return "Hello";
}

console.log(myFuncExpr()); // TypeError: myFuncExpr is not a function
var myFuncExpr = function() {
  return "Hello";
};

추가적으로 렉시컬 스코프와 스코프 체인이랑 비교

렉시컬 스코프의 지도:

컴파일 단계에서 생성됨.
변수와 함수의 선언 위치를 기준으로 스코프를 정의.
변수와 함수가 어느 스코프에 속해 있는지 미리 정의.

스코프 체인:

실행 시점에 생성됨.
변수나 함수를 찾기 위해 사용하는 스코프의 연속적인 참조.
현재 스코프에서 시작해 부모 스코프로 올라가며 변수나 함수를 찾음.