Mi Lugarcito
JavaScript - 클래스 예제와 콜백 함수 최종 정리 본문
class Counter{//클래스 (다양한 오브젝트를 만들기 위해서)
constructor(runEveryFiveTimes){//클래스가 처음 생성되면
this.counter=0;//counter라는 변수가 있는데 0부터 시작한다
this.callback = runEveryFiveTimes;
}
//클래스 안에 함수가 있다.(class에서 함수 선언할때는 function 이라고 표시 안해도 된다)
increase(){
this.counter++;
console.log(this.counter);
if(this.counter % 5===0){
this.callback(this.counter);//5배수일때마다 콜백
}
}
}
function printSomething(num){
console.log(`wow ${num}`);
}
function alertNum(num){
alert(`alert ${num}`);
}
//클래스를 이용해서 오브젝트 새로 만들기
const coolCounter = new Counter(printSomething);//Counter 생성자에 내가 원하는 callback 함수 전달해주기 => printSomething
//const coolCounter = new Counter(alertNum);
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
coolCounter.increase();
class Counter{//클래스 (다양한 오브젝트를 만들기 위해서)
constructor(runEveryFiveTimes){//클래스가 처음 생성되면
this.counter=0;//counter라는 변수가 있는데 0부터 시작한다
this.callback = runEveryFiveTimes;
}
//클래스 안에 함수가 있다.(class에서 함수 선언할때는 function 이라고 표시 안해도 된다)
increase(){
this.counter++;
console.log(this.counter);
if(this.counter % 5===0){
// this.callback(this.counter);//5배수일때마다 콜백
this.callback && this.callback(this.counter);
}
}
}
function printSomething(num){
console.log(`wow ${num}`);
}
function alertNum(num){
alert(`alert ${num}`);
}
//클래스를 이용해서 오브젝트 새로 만들기
const printCounter = new Counter(printSomething);//Counter 생성자에 내가 원하는 callback 함수 () 안에 넣어서 전달해주기 => printSomething or alertNum
const alertCounter = new Counter(alertNum);
'JavaScript' 카테고리의 다른 글
JavaScript - Blob(블랍) 이해하기 (0) | 2021.04.02 |
---|---|
JavaScript - es6.js & es11.js (0) | 2021.03.28 |
JavaScript - 함수정의, 호출 그리고 콜백함수 (0) | 2021.03.28 |
JavaScript - primitive type and object (0) | 2021.03.28 |
JavaScript - 함수 기본 (0) | 2021.03.28 |