[javascript] 클로저를 사용한 상태 관리

08 Dec 2023

javascript

웹 애플리케이션을 개발하다 보면 상태 관리가 중요합니다. 클로저를 사용하면 간단하게 상태를 관리할 수 있습니다.

클로저란 무엇인가요?

클로저는 내부 함수가 외부 함수의 컨텍스트에 접근할 수 있는 함수입니다. 이를 이용해 상태를 안전하게 유지하고 변경할 수 있습니다.

예를 들어, 다음과 같이 클로저를 사용하여 카운터를 구현할 수 있습니다.

function createCounter() {
  let count = 0;

  return function() {
    count++;
    console.log(count);
  };
}

const counter = createCounter();

counter(); // 1
counter(); // 2

클로저를 사용한 상태 관리

클로저를 이용하면 간단한 방법으로 상태를 관리할 수 있습니다. 애플리케이션에서 전역 상태를 피하고, 모듈 간 상태를 공유할 때 유용하게 사용할 수 있습니다.

예를 들어, 사용자의 로그인 상태를 관리하는 기능을 클로저를 사용하여 구현할 수 있습니다.

function createAuthManager() {
  let isAuthenticated = false;

  function login() {
    isAuthenticated = true;
  }

  function logout() {
    isAuthenticated = false;
  }

  function isLoggedIn() {
    return isAuthenticated;
  }

  return {
    login,
    logout,
    isLoggedIn
  };
}

const authManager = createAuthManager();

authManager.login();
console.log(authManager.isLoggedIn()); // true

authManager.logout();
console.log(authManager.isLoggedIn()); // false

결론

클로저를 사용하면 상태를 안전하게 관리하고 캡슐화할 수 있습니다. 이를 통해 코드 유지보수성이 높아지고 예상치 못한 상태 변화를 방지할 수 있습니다.

클로저를 사용하여 상태를 관리하는 것은 애플리케이션을 더 신뢰성 있게 만드는데 도움이 됩니다.

참고 자료

MDN Web Docs - Closures