← Back to NOTES 🌰 ← Effective JavaScript 🤿

← 아이템 10 - with를 사용하지 마라

핵심 요약

클로저는 JavaScript에서 가장 우아하고 표현력이 높은 기능 중 하나로, 함수와 그 함수가 선언된 스코프를 바인딩하는 개념이다. 클로저를 이해하기 위한 세 가지 핵심 원리를 파악하고, Private variables, Memoization, Event listeners 등의 다양한 활용 패턴을 익혀야 한다.

자세한 내용

클로저의 개념

• 정의: "an abstraction binding a function to its scope" (Wikipedia)
• C/C++, Java 등 기계 중심적/OOP 중심 언어 사용자에게는 이색적인 개념
• 함수형 언어에서는 자연스러운 개념
• 프론트엔드 개발에서 단골 면접 질문

클로저 이해를 위한 세 가지 핵심 원리

1. 외부 변수 참조 가능

JavaScript는 현재 함수 외부에서 선언된 변수를 참조할 수 있다.

2. 함수 실행 종료 후에도 변수 참조 유지

함수가 반환된 이후에도 외부 함수에 선언된 변수를 참조할 수 있다. JavaScript 함수는 실행 코드뿐만 아니라 스코프 정보도 함께 보관한다.

3. 외부 변수 값 변경 가능

클로저는 변수 값을 복사하는 것이 아니라 참조하므로, 외부 변수의 값을 변경할 수 있다.

클로저의 메커니즘

1. 내부 함수에서 외부 함수의 변수에 접근하면