오늘의 TIL

스코프란 ?

변수의 유효 범위 !

클로져란 ?

외부함수의 변수에 접근 할 수 있는 내부함수 !

클로져를 이해하기 위해선 스코프의 이해를 해야 한다

스코프 예제

let idiot = '이건우';

function showName() {
  let idiot = '바보'; // 지역 변수
  console.log(name); // 두번째 출력
}

console.log(idiot); // 첫번째 출력
showName();
console.log(idiot); // 세번째 출력

이렇게 되어 있는 경우에서 첫번째 출력에서는
전역변수인 '이건우'를 출력하게 되고

두번째에서는 showName이라는 함수를 호출 했으므로
showName 안에 선언된 idiot인 '바보'를 호출하게 된다

마지막 세번째 idiot 에서는 전역 변수인 '이건우 '를 출력하게 됩니다

그렇다면 지역변수가 선언 되어 있지 않은경우에선 어떻게 되나요 ?

let idiot = '이건우';

function showName() {
   idiot = '바보'; // 지역 변수
  console.log(name); // 두번째 출력
}

console.log(idiot); // 첫번째 출력
showName();
console.log(idiot); // 세번째 출력

이 경우에선 첫번째 출력에서의idiot은 전역변수를 가르키게 됨으로 '이건우' 를 출력하게 되고

두번째 출력에선 지역변수가 선언이 되어 있지 않아 이는, '바보'라는 값으로 할당하고 있는 idiot 변수는 전역에 선언된 idiot 변수를 그대로 사용하겠다는 의미입니다. 따라서 두번째 출력에서 idiot은 전역변수를 가르키게 되어 '이건우' 가 '바보' 로 전역변수를 값이 바뀌어 출력하게 됩니다

그다음 세번째로 다시 전역변수 idiot을 출력하게되면 두번째 출력에서 전역변수의 값을 바보로 바꾸어 주었기 때문에 전역 변수는 바보가 출력되게 됩니다

이렇게 스코프 예제를 풀어보면서 스코프에 대한 이해를 더 잘 할 수있게 되었습니다 .

클로져

클로져 함수의 특징은 함수를 return 하는 함수입니다.
클로저는 리턴하는 함수에 의해 스코프(변수의 접근 범위)가 구분됩니다.
클로저의 핵심은 스코프를 이용해서, 변수의 접근 범위를 닫는(closure; 폐쇄) 데에 있습니다. 따라서, 함수를 리턴하는 것만큼이나, 변수가 선언된 곳이 중요합니다.

예제를 보겠습니다.

let geonwoo = function(x) {
  return function(y){
    return x + y
  }
}

위와같이 외부함수는 내부함수인 y에 접근이 불가 합니다
하지만 내부함수인 y는 return값인 x+y에서 x를 외부함수에 접근이 가능합니다 .

이 에제를 통해 오늘도 스코프와 클로져에 대해 배워보았습니다.