← 뒤로

JavaScript 클로저 완벽 이해

JavaScript 클로저

클로저는 함수와 그 함수가 선언된 렉시컬 환경의 조합입니다.

기본 개념

function outer() {
  let count = 0;
  return function inner() {
    count++;
    return count;
  };
}

const counter = outer();
console.log(counter()); // 1
console.log(counter()); // 2

실전 활용

데이터 은닉

function createUser(name) {
  let _name = name;
  return {
    getName: () => _name,
    setName: (n) => { _name = n; }
  };
}

이벤트 핸들러

for (let i = 0; i < 5; i++) {
  setTimeout(() => console.log(i), i * 100);
}

클로저는 JavaScript의 핵심 패턴이며, React Hooks도 클로저 기반입니다.