[JavaScript] 클로저정리

밖에서는 안보이고 안에서만 밖을 볼수있다.

클로저가 대체 뭘까❓

• 외부 함수의 변수에 접근 가능한 함수입니다.
• 리턴하는 함수에 의해 스코프(변수 접근 범위)가 구분되며,
• 스코프를 이용해서 변수의 접근 범위를 폐쇄합니다 (closure 폐쇄)
• 이러한 클로저의 핵심은 함수와 함수가 선언된 어휘적(lexical) 환경의 조합입니다.
• 함수 내에서 다른 함수(내부 함수)가 리턴될 때, 리턴된 내부 함수는 클로저 함수라고 부르며, 외부 함수에 있는 변수에 접근 가능하다.

클로저 왜쓰는가❓

• 활용한 상황 중 가장 유용한 것은 현재 상태를 기억하고 변경된 최신 상태를 유지하는 것이다.
• 이를 통해 상태 유지를 위해 전역 변수를 사용하지 않아도 되어 버그를 방지할 수 있다.
• 클로저는 반환된 내부 함수가 자신이 선언됐을 때의 환경(Lexical environment)인 스코프를 기억하여 자신이 선언됐을 때의 환경(스코프) 밖에서 호출되어도 그 환경(스코프)에 접근할 수 있다
• 이러한 클로저 모듈 패턴을 활용하면 여러 개의 함수를 리턴할 수 있어 매우 유용하다.

💊 캡슐화

클로저는 정보를 은닉화, 캡슐화하는 역할도 수행합니다.
이는 변수를 기억하여 끝까지 갖고 있기 때문에 외부에서도 접근 가능합니다.

📝 예제

위에서 예제는 클로저가 생성이 되었다.

예를 들어, 다음과 같은 예제를 살펴봅시다.

1. 여기서 c1, c2, c3를 출력했을 때 앞 1,2,3은 외부 변수 a의 값이 1씩 증가하고,

2. 뒤 1,1,1은 함수 내부의 지역 변수 b의 값이 1씩 증가했다.

3. 내부 변수 b는 캡슐화되어 외부에서는 수정할 수 없다.

그럼 클로저랑 무슨 관련이 있는가?

1. 앞서 클로저 내부에서 외부에 접근할때 생성이 된다고 했다. 리턴 함수의 a++는 따로선언 한것이 없기 때문에 전역변수 a에 접근하고 b++는 지역변수 test함수에 b를 선언하여 지역 변수 b에 접근했다.
2. 그래서 클로저가 생성이 되었다. b는 지역변수에 접근하여 수정할수 없도록 캡슐화되었고
3. c1, c2, c3 를 출력할때 각각 1,1,1이 나온것은, 캡슐이 밖으로 나왔을때 그대로 각자에게 새롭게 할당되어서 1,1,1 각각의 값이 나왔다.

🥱 내가 생각한 결론

• 함수를 리턴하는 것만으로 클로저가 생성되는 것은 아니다. 클로저는 외부 함수에 접근하여 그 내부 함수의 변수를 참조할 때 생성된다.
• 따라서, 클로저는 'let name = "park"'와 같이 변수를 직접 선언하는 것보다는 내부 함수에서 외부 함수의 변수를 참조하면서 생성되는 것으로 이해할 수 있다.
• 이 때, 핵심은 참조된 변수의 값을 수정하거나 변경하지 않고 고유의 값으로 저장하고(이를 캡슐화, 은닉화), 외부에서 호출되어도 접근할 수 있는 것이다.

클로저를 이해하면 함수형 프로그래밍과 비동기 프로그래밍에서 많은 도움이 된다.