FE BE 개발 메모장/Javascript

자바스크립트 함수의 범위(Scope)

스코프(Scope)

 Scope는 범위라는 뜻을 가지고있는데, 자바스크립트에서는 함수를 선언 할 때 생기는 개념이고, 두 가지 타입이 존재한다 전역 스코프와 지역 스코프 두가지다. 변수에 접근할 수 있는 범위를 의미한다.

 

전역 스코프(Global Scope)

 - 전역 스코프는 변수가 전역에 선언되어 있어 어느곳에서든지  변수에 접근이 가능하다. 전역 스코프에 선언된 변수는 전역 변수라 하며, Window 객체의 변수가 된다.

 

지역 스코프(Local Scope)

 - 지역 스코프는 해당 지역에서만 접근이 가능하며, 지역을 벗어난 곳에선 접근이 불가능하다.  함수를 생성하고, 함수 내부에서 선언된 변수를 지역변수, 함수의 지역변수라고 한다.

 

let x = 1;  //전역 스코프에 선언된 변수 = 전역 변수
            //window객체에 속성을 생성하지는 않음 (window.x //undefined)
function scope() {  //지역(함수) 스코프 = 지역 변수
  let x = 2;        
  console.log(x);
}

scope(); // 2

console.log(x); //1

 

ex) let과 var의 차이점

유효 범위 규칙에 따라 let과 var의 차이점은 다음과 같다.

function varTest() {
  var x = 1;
  if (true) {
    var x = 2;  // 상위 블록과 같은 변수!
    console.log(x);  // 2
  }
  console.log(x);  // 2
}

function letTest() {
  let x = 1;
  if (true) {
    let x = 2;  // 상위 블록과 다른 변수
    console.log(x);  // 2
  }
  console.log(x);  // 1
}

이점은 전역 스코프에서도 마찬가지이다.

var x = 'global';
let y = 'global';
console.log(window.x); // "global" ,전역 객체의 속성 x를 생성
console.log(window.y); // undefined ,전역 객체의 속성 y를 생성하지 않음

 

스코프 체인(Scope Chain)

let a = 'a'
 function outer() {
   console.log(a);
   function inner() {
     let b = 'b';
     console.log(a);
   }
  inner();
 }
 outer();
 conso.e.log(name);

 

 내부 함수는 외부 함수의 변수에 접근이 가능하지만 그 반대는 접근이 불가능하다. 위의 예제에서 보게되면 inner()함수는 b라는 변수를 찾기위해 자기 범위에서(스코프) 찾고, 없으면 한 단계 올라가 outer 스코프에서 찾는다. 만약 없으면 결국 전역(Global) 스코프에서 찾게된다. 

 

a라는 변수는 거슬러 올라가면서 결국 전역 스코프에 선언된 변수 a를 찾아낸다 이런식으로 범위를 넓혀가며 찾는 관계를 스코프 체인이라고 한다.

 

 

출처 

MDN let

제로초 함수의 범위

 

 

velog.io/@th0566/Javascript-%EC%96%95%EC%9D%80-%EB%B3%B5%EC%82%AC-%EA%B9%8A%EC%9D%80-%EB%B3%B5%EC%82%AC

제로초 깊은복사와 얕은복사

심도있는 깊은복사와 얕은복사

'FE BE 개발 메모장 > Javascript' 카테고리의 다른 글

함수와 고차함수  (0) 2020.12.08
클로저(Closure)란?  (0) 2020.10.27
자바스크립트에서 호이스팅이란?  (0) 2020.10.07
for in, for of, forEach()  (0) 2020.10.06
조건문 if() {  (0) 2020.10.06