스코프(Scope)

insuzy·2021년 8월 12일
JavaScript
post-thumbnail

📌 스코프란 무엇인가

  • 스코프는 변수에 접근할 수 있는 범위이자 수명이다.
  • 변수는 선언 위치에 따라 스코프를 가지게 된다.(전역 스코프를 갖는 전역 변수/지역 스코프를 지역 변수)


📎 타입

1. 전역 스코프(Global Scope)

let a = 1; 

function print() { 
 console.log(a);
}

print(); //1
  • 코드 어디에서든지 참조할 수 있는 범위.

2. 지역 스코프(Local Scope)

let a = 1; 

function print() { 
 let a = 111;
 console.log(a);
}

print(); // 111
console.log(a); // 1
  • 함수(함수 코드 블록)내에서의 범위이며 함수 자신과 하위 함수에서만 참조 가능.
  • 전역변수보다 우선 순위가 높다.



📎 특징

1. 중첩 스코프(Nested Scope)

function example(a){
  console.log(a+b);
}

const b = 2;
example(2); //4
  • 대상 변수를 현재 스코프에 없을시 엔진은 다음 바깥의 스코프에서 변수를 찾거나 전역 스코프라 부르는 가장 바깥 스코프에 도달할 때까지 계속한다.

2. 렉시컬 스코프(Lexical Scope)

let x = 1; // global

function a() {
  let x = 10;
  b();
}

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

a(); // 1
b(); // 1
  • 함수가 선언 되는 위치에 따라 상위 스코프를 결정하는 스코프이다.

3. 함수 레벨 스코프(function-level scope)

let a = 1;    

(function () {
  let b = 2;   
})();

console.log(a); // 1
console.log(b); // "b" is not defined
  • 자바스크립트는 함수 레벨 스코프(function-level scope)를 따른다.
  • 함수 내에서 선언된 매개변수와 변수는 함수 외부에서는 유효하지 않다.
  • 내부함수는 자신을 포함하고 있는 외부함수의 변수에 접근할 수 있다.

4. 비 블록 스코프(Non block-level scope)

if (true) {
  let x = 5;
}
console.log(x);
  • 전역 스코프 중 하나이며 함수 밖에서 선언된 변수는 코드 블록 내에서 선언됐을 지라도 전역 스코프이다.
  • why? 자바스크립트는 블록 레벨 스코프를 사용하지 않는다.

5. 암묵적 전역

let x = 10;
console.log(y); // ReferenceError: y is not defined

function foo () {
  console.log(y) //  y is not defined
  
  function bar() {
    y = 20; // y는 마치 선언된 변수처럼 동작
    console.log(x + y);
  }
  
  bar();
  console.log(y) // 20
}

foo(); // 30
profile
insuzy
UI Developer. publisher
이전 포스트

시맨틱 마크업(Semantic Markup)

다음 포스트

스코프(Scope)

0개의 댓글