클로저(closure)

최현호·2022년 4월 4일

목록 보기

13/38

클로저(closure)

내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 가리킵니다.

어휘적 환경(Lexical Environment)

// (1)
// one : 초기화 X, addOne : function

let one; // (2) one : undefined, addOne : function
one = 1; // (3) one : 1, addOne : function -> 전역 Lexical

function addOne(num){
    console.log(one + num);
}

addOne(5); // (4) 함수가 실행되는 순간 새로운 Lexical 환경이 만들어집니다. num : 5

(1) : 코드가 실행되면 스크립트 내에서 선언한 변수들이 Lexical 환경 에 올라갑니다.
(4) 에서 함수가 넘겨받은 매개변수와 지역변수가 저장됩니다.

함수가 호출되는 동안 함수에서 만들어진 내부 Lexical 환경, 즉 (4)번과

외부에서 받은 전역 Lexical 환경(3) 두 개를 가집니다.
내부 Lexical 환경은 외부 Lexical 환경에 대한 참조를 받습니다.
코드에서 변수를 찾을 때는 내부에서 찾고 없을 경우 외부, 그 다음 전역 Lexical 환경까지 범위를 넓혀서 찾습니다.
위의 코드에서 one + num 을 우선 내부 Lexical 환경에서 찾습니다.
num 은 찾았지만 one 은 찾지 못했습니다.
찾지 못했으니 외부로 범위를 넓혀서 one 을 찾습니다.

예시

let base = 'Hello, ';
function sayHelloTo(name) {
  let text = base + name; // 외부 환경에서 찾는다.
  return function() {
    console.log(text); // 내부 환경에서 text라는 변수가 없기 떄문에
  };
}

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

내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 가리킵니다.

클로저의 사용하는 이유

상태유지 : 현재 상태를 기억하고 변경된 최신 상태를 유지 할 수 있습니다.
정보의 은닉 : 자바스크립트에서 private 기능을 보완 합니다.

클로저를 이용하면 제한적인 접근만을 허용하여 private한 변수 또는 메소드의 효과를 낼 수 있습니다.

자바스크립트는 태생적으로 private, public 등의 별도 문법이 없는 언어