[JavaScript] 클로저

클로저(closure)란?

일단 검색하면 클로저는 '함수와 함수가 선언된 어휘적 환경(Lexical enviroment)의 조합입니다.'라고 나오는데 뭐라는지.. 이해가 하나도 안가서 하나하나 검색해봤다.

먼저, 어휘적 범위지정에 대해서 알아보자

Lexical scoping 어휘적 범위지정

변수가 어디에서 사용 가능한지 알기 위해 그 변수가 소스코드 내 어디에서 선언되었는지를 고려한다는 것을 의미한다.

만약,

function outer(){
	let x = 'hi';
    function inner(){
    	console.log(x);
    }
    
    innerFunc();
}

outerFunc();

이러한 코드가 있다고 가정해보자.

코드가 실행시키면 outerFunc이 먼저 실행되며 변수 x에 값을 할당한다.
그리고 나서 innerFunc이 실행되는데 이때 함수 안에 x가 있는지 확인하고 없으면 그 위의 함수에서 참조할 수 있는지 찾아보게 된다. 이때는 상위 함수에 변수가 있어서 참조했는데 만약 outerFunc에도 없다면 전역에서 찾아보게 된다. => 이게 바로 클로저다... 뭔가 사전보다는 이해가 잘되는데 한줄로 잘 설명할 문장을 한번 고민해보자...

클로저(closure)는 내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것! - 생활코딩에 적힌 문장이 제일 잘 정리된 것 같다.-

이렇게 내부함수가 외부함수 스코프에 접근가능하며 외부함수의 실행이 종료된 후에도 클로저는 외부함수의 어휘적환경에 접근할 수 있다.

그래서 클로저는 왜 필요한가??

1. 현재 상태를 기억하고 있다가 상태가 변경되면 그것을 최신상태로 유지할 수 있어서 '상태유지'를 위해 사용한다.
2. 변경되어서는 안될 변수를 '은닉'해줄 수 있다. 외부함수 안에 클로저를 반환하도록 내부함수를 만들어서 필요한 변수를 할당하고 외부함수는 실행 후 사라지면 내부함수는 외부함수가 실행된 후에도 변수를 참조할 수 있기 때문에 안전하게 짤 수 있다

오.. 클로저를 알기 전에는 이렇게 중요한 개념인줄 몰랐는데 실무에 가게 되면 정말로 필수적으로 알아야되는 개념인 것 같다! 프로젝트에서는 변수를 남발했던 것 같은데 그게 지금 생각하면 진짜 위험한 코드였던 것 같다..

클로저는 어려운 개념이니 반복해서 들어와서 읽어야겠다!