클로저 (Closure) 정리

클로저란?

함수가 선언될 당시의 외부 변수를 기억하고 함수가 실행이 끝난 후에도 그 변수에 접근할 수 있는 함수입니다.

*일반적으로 함수는 실행이 끝나면 내부 변수는 사라지지만 클로저는 그 값을 기억해서 다시 사용할 수 있는 특별한 함수

---

클로저의 동작 방식

1. 함수 안에 내부 함수가 정의되어 있고
2. 내부 함수가 외부 함수의 변수를 참조하고 있으며
3. 외부 함수가 return으로 내부 함수를 반환할 경우

반환된 내부 함수는 외부 함수가 종료된 이후에도 외부 변수에 접근할 수 있게 됩니다. 이를 클로저라 부릅니다.

---

클로저가 중요한 이유

1. 값을 기억하고 유지할 수 있다.
   • 클로저를 이용하면 함수 외부에서도 내부 값을 유지할 수 있다.
   • 예로 카운터처럼 누적되는 숫자값을 기억해야 할 때 유용하다.
2. 변수를 외부에서 숨길 수 있다.
   • 자바스크립트는 private 같은 키워드가 없어 변수를 숨기기 어렵다.
     하지만 클로저를 이용하면 특정 변수에 직접 접근하지 못하게 만들 수 있어 보안성과 코드 안정성이 올라간다.
3. 비동기 처리에서 값 보존에 유리하다.
   • setTimeout , addEventListner , callback 등에서 반복문 안의 값이 꼬이는 문제를 방지할 수 있다.
4. React 등 프레임워크의 핵심 기반
   • React의 useState, useEffect 같은 훅들도 내부적으로 클로저의 원리를 활용하고 있다.
   • 상태를 저장하고 업데이트하는 구조를 만들기 위해 클로저가 필수적이다.

---

클로저 예시 코드

function Nice() {
	let count = 0;
    	return function khj(){
        	count++;
        	console.log(count);
        };
};
const counter = Nice();
counter(); // 1
counter(); // 2
counter(); // 3

---

클로저는 단순히 함수 안에서 또 다른 함수를 만드는 걸 넘어서 자바스크립트에서 상태를 관리하고 기억하기 위한 핵심적인 기술 이다.

• 함수가 종료되어도 내부 데이터를 유지하고 싶을때 
• 값을 외부에 노출시키지 않고 보호하고 싶을 때
• 비동기 처리에서 특정 값을 기억하고 싶을 때