[JS] CS 지식 중 클로저에 대해 알아보기

김현수·2023년 11월 10일
0

JS

목록 보기
4/13


⭐ 클로저


함수가 선언될 때의 렉시컬 환경 기억
함수가 해당 렉시컬 환경 밖에서 호출되더라도 해당 환경에 접근 가능하게 하는 기능

@ 데이터 은닉과 캡슐화
	클로저는 객체 데이터를 은닉하고, 
    특정 함수를 통해서만 데이터를 조작할 수 있게 만듭니다.
    
@ 상태 유지
	반복되는 작업에서 어떤 상태(예: 카운터)를 유지할 때 사용됩니다.
    
@ 콜백 함수에서 외부 데이터 사용
	비동기 작업(예: AJAX 요청, 타이머)에서 클로저를 통해 
    외부 데이터를 안전하게 사용할 수 있습니다.
function createCounter() {
  let count = 0;

  return {
    increment: () => count++,
    decrement: () => count--,
    getCount: () => count
  };
}

const counter = createCounter();
counter.increment();
console.log(counter.getCount()); // 1
counter.decrement();
console.log(counter.getCount()); // 0

function createUniqueIdGenerator() {
  let currentId = 0;

  return () => currentId++;
}

const generateId = createUniqueIdGenerator();
console.log(generateId()); // 0
console.log(generateId()); // 1
console.log(generateId()); // 2

function setupTimer(seconds) {
  setTimeout(() => {
    console.log(`${seconds}초가 지났습니다.`);
  }, seconds * 1000);
}

setupTimer(3); // 3초 후 "3초가 지났습니다." 출력

const calculator = (function() {
  let data = 0;

  function add(num) {
    data += num;
  }

  function subtract(num) {
    data -= num;
  }

  function printData() {
    console.log(data);
  }

  return {
    add,
    subtract,
    printData
  };
})();

calculator.add(5);
calculator.printData(); // 5
calculator.subtract(3);
calculator.printData(); // 2
profile
일단 한다

0개의 댓글