Scope

scope는 프로그래밍 언어에서 유효범위가 어느 범위까지 참조하는지를 뜻한다. 따라서 scope를 잘 이해하고 있으면 변수와 매개변수의 접근성과 생존기간을 제어할 수 있다.

scope의 종류

1. global scope
   전역 유효범위(global scope)의 경우 스크립트 전체에서 참조된다.
2. local scope
   지역 유효범위(local scope)의 경우 정의된 함수 내에서만 참조된다.
   

자바스크립트에서의 scope

1. 함수 단위의 유효범위를 갖는다.
   자바스크립트에서는 if for 와 같은 블록단위가 아닌 함수를 단위로 유효범위를 갖는다.

2. 변수명 중복을 허용한다.
   자바스크립트에서 변수명이 중복되면 가장 가까운 범위에 있는 변수를 참조한다.(에러 x)

   let num = 10
   function example(){
     let num = 40
     return num
   }
   example() //40

3. 변수형(let) 생략 가능하다.

   function num(){
     number = 10
     return(number)
   }
   function num2(){
     return(number)
   }
   
   num() //10
   num2() //10

자바스크립트에서는 let, const 와 같은 변수형을 선언하는데 이러한 변수형을 생략하는 것이 가능하다.

단, 변수형을 생략하게 되면 함수안에서 변수 선언이 이루어져도 전역 변수로 선언된다.
4. lexical scoping
자바스크립트에서는 함수가 선언된 시점에서의 유효범위를 갖는다.(호출된 시점이 아니다.)

closure

클로저는 독립적인 (자유) 변수를 가리키는 함수이다. 또는, 클로저 안에 정의된 함수는 만들어진 환경을 ‘기억한다’.

let base = 'Hello, ';
function sayHelloTo(name) {
  var text = base + name;
  return function() {
    console.log(text);
  };
}

var hello1 = sayHelloTo('승민');
var hello2 = sayHelloTo('현섭');
var hello3 = sayHelloTo('유근');
hello1(); // 'Hello, 승민'
hello2(); // 'Hello, 현섭'
hello3(); // 'Hello, 유근'

예시의 경우text 값이 변하는 것처럼 보인다. 하지만text라는 변수 자체가 여러 번 생성된 것이다. 즉, hello1()과 hello2(), hello3()은 서로 다른 환경을 가지고 있는 것이다.

환경을 기억한다는 것은 메모리가 소모된다는 것을 의미한다.

scope chain

scope chai을 이용하면 함수가 중첩 상태에 있을 때 하위 함수내에서 상위 함수 스코프와 전역함수 스코프까지 참조하는 것이 가능하다.

function student(){
  let name = "철수"
  function write(age){
    return (`이름 : ${name}, 나이 : ${age}`)
  }
  return write
}

student()(9) //'이름 : 철수, 나이 : 9'

write 함수 안에서 name 변수를 찾고, write함수에 name이 없기때문에 상위 스코프인 student 함수에서 name이라는 변수를 찾는다.

참고 문서
https://www.nextree.co.kr/p7363/
https://hyunseob.github.io/2016/08/30/javascript-closure/