JavaScript/모던 자바스크립트 딥다이브
[JS] 클로저
김춘삼씨의 고양이
2024. 6. 2. 15:11
📌 렉시컬 스코프
- 렉시컬 스코프: 함수를 어디에 정의했는지에 따라 상위 스코프를 결정하는 것
- 함수의 상위 스코프를 함수를 정의한 위치에 의해 정적으로 결정되고 변하지 않음
- 렉시컬 환경은 자신의 '외부 렉시컬 환경에 대한 참조'를 통해 상위 렉시컬 환경과 연결됨
- 렉시컬 환경의 '외부 렉시컬 환경에 대한 참조'에 저장할 값, 즉 상위 스코프에 대한 참조는 함수 정의가 평가되는 시점에 함수가 정의된 환경(위치)에 의해 결정됨
📌 함수 객체의 내부 슬롯 [[Environment]]
- 함수는 자신의 내부 슬롯 [[Environment]]에 자신이 정의된 환경(상위 스코프)의 참조를 저장함
- 함수 객체는 자신이 존재하는 한 내부 슬롯 [[Environment]]에 저장한 렉시컬 환경의 참조(상위 스코프)를 기억함
- 외부 렉시컬 환경에 대한 참조에는 함수 객체의 내부 슬롯 [[Environment]]에 저장된 렉시컬 환경의 참조가 할당됨
상위 스코프
- 함수 객체의 내부 슬롯 [[Environment]]에 저장된 현재 실행 중인 실행 컨텍스트의 렉시컬 환경의 참조
- 자신이 호출되었을 때 생성될 함수 렉시컬 환경의 '외부 렉시컬 환경에 대한 참조'에 저장될 참조값
📌 클로저와 렉시컬 환경
클로저
- 함수와 그 함수가 선언된 렉시컬 환경과의 조합
- 외부 함수보다 중첩 함수가 더 오래 유지되는 경우 이미 생명 주기가 종료한 외부 함수의 변수를 참조하는 중첩 함수
- 일반적으로 중첩 함수가 상위 스코프의 식별자를 참조하고 있고 중첩 함수가 외부 함수보다 더 오래 유지되는 경우에 한정함
- 외부 함수보다 더 오래 생존한 중첩 함수는 외부 함수의 생존 여부와 상관없이 자신이 정의된 위치에 의해 결정된 상위 스코프를 기억함
- 함수를 어디서 호출하든 상관없이 함수는 언제나 자신이 기억하는 상위 스코프의 식별자를 참조할 수 있으며 식별자에 바인딩된 값을 변경할 수도 있음
- 자유 변수: 클로저에 의해 참조되는 상위 스코프의 변수
- 모던 자바스크립트 엔진은 최적화가 잘 되어 있어 상위 스코프의 식별자 중 자유 변수만 기억함
클로저로 인정되지 않는 경우
- 상위 스코프의 어떤 식별자도 참조하지 않는 경우 (대부분의 모던 브라우저는 최적화를 통해 상위 스코프를 기억하지 않음)
- 중첩 함수의 생명 주기가 외부 함수보다 짧은 경우 (중첩 함수가 외부 함수보다 일찍 소멸되어 생명 주기가 종료된 외부 함수의 식별자를 참조할 수 있다는 클로저의 본질에 부합하지 않음)
📌 클로저의 활용
- 상태를 안전하게 은닉하고 특정 함수에게만 상태 변경을 허용하기 위해 사용함
- 클로저는 상태가 의도치 않게 변경되지 않도록 안전하게 은닉하고 특정 함수에게만 상태 변경을 허용하여 상태를 안전하게 변경하고 유지하기 위해 사용함
- 함수를 호출해 함수를 반환할 때 반환된 함수는 자신만의 독립된 렉시컬 환경을 가짐
📌 캡슐화와 정보 은닉
캡슐화
- 객체의 상태를 나타내는 프로퍼티와 프로퍼티를 참조하고 조작할 수 있는 동작인 메서드를 하나로 묶는 것
정보 은닉
- 객체의 특정 프로퍼티나 메서드를 감출 목적으로 사용하기도 함
- 외부에 공개할 필요가 없는 구현의 일부를 외부에 공개되지 않도록 감추어 적절치 못한 접근으로부터 객체의 상태가 변경되는 것을 방지해 정보를 보호함
- 객체 간의 상호 의존성(결합도)을 낮추는 효과가 있음
- 자바스크립트는 정보 은닉을 완전하게는 지원하지 않음
📌 자주 발생하는 실수
자바스크립트 함수 레벨 스코프 특성으로 인해 for문의 변수 선언문에서 var 키워드로 선언한 변수가 전역 변수가 되어 오류가 발생할 수 있음
- let 키워드 사용으로 해결 가능
- 함수형 프로그래밍 기법인 고차 함수를 사용해 해결 가능
참고문헌 및 출처 : 모던 자바스크립트 Deep Dive (이웅모)