Scope

Scope란?

스코프는 참조 대상 식별자(identifier)를 찾아내기 위한 규칙이다.

간단하게 설명하면 ‘변수에 접근할 수 있는 범위’라고 말할 수 있다.

스코프의 구분

스코프는 크게 두 가지로 나눌 수 있다.

• 전역 스코프(Global Scope)
  • 최상위 레벨의 스코프
  • 전체 코드 어디에서든 접근 가능
• 지역 스코프(Local Scope)
  • 특정 함수에 해당하는 스코프
  • 해당 함수와 하위 함수에서만 접근이 가능하다.

전역 스코프(Global Scope)

브라우저에서 실행되는 JavaScript에서는 window 객체가 담당한다.

전역에서 변수를 선언하면 전역 스코프를 갖는 전역 변수가 된다.

n0='n0'; //암묵적 전역
var v0='v0';
let l0='l0';
const c0 = 'c0';
console.log(v0, n0, l0, c0);
console.log(window.v0, window.n0, window.l0, window.c0);

var 키워드로 선언한 전역 변수(v0)나 전역 함수, 암묵적 전역의 경우 모두 전역 객체 window의 프로퍼티가 된다.

암묵적 전역(implicit global)
키워드 없이 변수를 선언할 경우 스코프 체인을 통해 해당하는 변수의 선언을 찾을 수 없으므로 참조 에러가 발생해야 하지만 자바스크립트 엔진이 window의 프로퍼티로 해석하여 동적으로 생성하는 것을 말한다.
이는 변수가 아닌 전역 객체의 프로퍼티이기 떄문에 호이스팅은 발생하지 않는다.
그리고 전역 객체이기때문에 함수 내에서 키워드 없이 선언하더라도, 전역 스코프에서 참조할 수 있다.

let, const 키워드로 선언한 전역 변수는 Script Scope에 저장된다.

Script Scope
let이나 const로 전역변수를 선언하고 DevTools에서 이를 확인할 경우, Global Scope가 아닌 Script Scope에 변수가 저장되어있는 것을 볼 수 있다.
ES6 이전의 방식과 이후의 새로운 방식을 두 부분으로 전역 환경을 나누되, 이를 논리적으로 하나의 환경으로 간주하는 것이다.
https://stackoverflow.com/questions/40685277/what-is-the-purpose-of-the-script-scope

지역 스코프 (Local Scope)

전역이 아닌 함수 내에 선언된 변수들은 지역 스코프를 가진다.

지역 스코프는 함수 스코프와 블록 스코프로 나누어진다.

• 함수 스코프 (Function-level Scope)
  • 함수 내에서 선언한 변수는 그 함수 내에서만 접근 할 수 있다.
  • 자바스크립트는 기본적으로 함수 스코프를 따른다.
  • var가 이에 해당한다.
• 블록 스코프 (Block-level Scope)
  • 선언된 블록 내에서만 접근 할 수 있다.
  • for문, if문, switch문 같이 {,} 블록이 생성되는 경우를 말한다.
  • let과 const가 이에 해당한다.

렉시컬(=정적) 스코프 (Lexical(=Static) Scope))

함수가 어디서 호출되었는지가 아니라 어디서 선언하였는지에 따라 상위 스코프를 결정되는 것

var x = 1; // global

function first() {
  var x = 10;
  second();
}

function second() {
  console.log(x);
}

first(); // 1
second(); // 1

함수 선언을 기준으로 상위 스코프가 결정되기 떄문에,

함수 second의 상위 스코프는 전역 스코프이고, 스코프 체인에 의해 전역 변수 x를 할당받는다.