개발 공부/자바스크립트

[엘리의 드림코딩 JS 보충] 18. 클래스 예제와 콜백함수 최종 정리

5묘 2022. 12. 6. 22:45

https://youtu.be/fU25vI0EOOk

class Counter {
  constructor(runEveryFiveTimes) { //2) 메서드 대신 콜백 함수를 생성자에 집어넣으면 더 간단하다.
    this.counter = 0;
    this.callback = runEveryFiveTimes;
  }

  increase() {
    this.counter++;
    console.log(this.counter);
    if (this.counter % 5 === 0) {
      this.callback && this.callback(this.counter);
    }
  }
}

function printSomething(num) {
  console.log(`Wow! ${num}`);
}
function alertNum(num) {
  alert(`wow! ${num}`);
}; 

const printCounter = new Counter(printSomething);
const alertCounter = new Counter(alertNum);

//1) 클래스의 메서드에 콜백함수를 넣음으로써
// 사용자가 원하는 기능을 클래스 밖에서 customize할 수 있다.
// coolCounter.increase(alertNum);
for (let i=0; i<5; i++) {
  printCounter.increase();
}
for (let i=0; i<5; i++) {
  alertCounter.increase();
}
// 클래스는 하나의 완벽한 틀보다는 계속해서 조립하는 레고라고 생각하자.
// 이것저것 만들어보자.