반응형
var x = 1;
function foo() {
var x = 10;
bar();
}
function bar() {
console.log(x);
}
foo(); // ?
bar(); // ?
위 예제의 실행 결과는 bar 함수의 상위 스코프가 무엇인지에 따라 결정된다. 두 가지 패턴을 예측할 수 있다.
1. 함수를 어디서 호출했는지에 따라 함수의 상위 스코프를 결정한다.
2. 함수를 어디서 정의했는지에 따라 함수의 상위 스코프를 결정한다.
첫 번째 방식으로 함수의 상위 스코프를 결정한다면 bar 함수의 상위 스코프는 foo함수의 지역 스코프와 전역 스코프일 것이다.
이 방식을 동적 스코프라 한다. 함수가 호출되는 시점에 동적으로 상위 스코프를 결정해야 하기 때문에 동적 스코프라 부른다.
두 번째 방식으로 함수의 상위 스코프를 결정한다면 bar 함수의 상위 스코프는 전역스코프일 것이다.
이 방식을 렉시컬 스코프 또는 정적 스코프라 한다. 동적 스코프 방식처럼 상위 스코프가 동적으로 변하지 않고 함수가 정의가 평가되는 시점에 상위 스코프가 정적으로 결정되기 때문에 정적 스코프라고 부른다. 자바스크립트를 비롯한 대부분의 프로그래밍 언어는 렉시컬 스코프를 따른다.
따라서 위 예제를 실행하면 전역 변수 x의 값 1을 두 번 출력한다.
반응형
'Web > JavaScript' 카테고리의 다른 글
프로토타입 (0) | 2022.04.14 |
---|---|
라인 피드와 캐리지 리턴 (0) | 2022.04.07 |
자주 사용하는 정규표현식 [ javascript ] (0) | 2021.09.08 |
&&와 || 연산자 (0) | 2021.07.19 |
하나만 true/truthy인지 구분하기 js (0) | 2021.07.19 |