[javascript] scope 란 , 예제

스코프 어떤 대상을 다른 대상과 구분하여 식별할 수 있는 유일한 이름)를 찾아내기 위한 규칙

 

1-1. 전역 스코프

- 코드 어디에서든지 참조할 수 있다.

 

 

 

 

1-1. 함수레벨 스코프

- 자바스크립트에서 var 키워드로 선언된 변수, 함수 선언식으로 만들어진 함수는 함수 레벨 스코프를 지닌다.

- 변수는 함수 내부 전체에서(만) 유효한 식별자가 된다.

// 전역 스코프

var global = "global";


function foo() {
  var local = "local";
  console.log(global);
  console.log(local);
}
if(true) {
  var global2 = "if";
}

foo();

console.log(global); // global
console.log(global2); // if
console.log(local); // Uncaught ReferenceError: local is not defined



/*  
되도록 전역변수는 지양하자 
    의도치 않게 재할당 될수도 있고
    코드 예측도 어렵게 만든다
*/

 

1-2. 블록 레벨 스코프

- ES6의 let, const 키워드는 블록레벨 스코프 변수를 만들어 준다.

- 여기서 블록이란 if/else, while/for 내부로 정해지는 범위를 말한다.

- ES6에서 let, const가 도입되면서 var는 사용하지 않는다. let으로 대체가 가능하고, var는 함수 전체에 대한 스코프를 가지므로, 혼     란을 야기할 수 있다.

 

// 블록 스코프

(function loop() {
  for (let i = 0; i < 5; i++) {
    console.log(i);
  }
  console.log("final", i); // ReferenceError: i is not defined
})();

/* 
블록스코프느 말 그대로  {} 이 생성될때마다 새로운 스코프가 만들어진다

방을 만들고 문을 잠가버려!!

*/

 

1-3. 렉시컬 스코프

- 함수를 어디서 호출하는지가 아니라 어디에 선언하였는지에 따라 결정

 

 

var x = 1;

function foo() {
  var x = 10;
  bar();
}

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

foo(); // 1
bar(); // 1

/* 
자바스크립트는 함수를 어디서 호출했냐가 아닌 함수를 어디서 선언했는지로 스코프를 결정하는 렉시컬 스코프를 따른다
*/