다중 콜백을 사용하는 자바 스크립트의 글로벌 타이머

Question

자바 스크립트에서 글로벌 타이머 개체를 만든 다음 콜백을 즉시 추가 할 수 있습니다. 이 방법을 사용하면 스크립트에서 하나의 전역 타이머를 사용하여 배수를 사용하여 리소스를 낭비하지 않고 특정 간격으로 모든 작업을 실행할 수 있습니다.

var timer = new function() { 
clearInterval(this.interval); 

//[1] At this point I want the Callbacks to be run 

var self = this; 
setTimeout(function() {self.timer()}, 200); 
} 

function otherObject = new function() { 
    //When created I want to bind my object's function called cb to the global timer at [1] 
} 

otherObject.prototype.cb = function() { 
    //Stuff that should be done every time the timer is run 
} 

var someObject = new otherObject(); 

가 어떻게 간격으로 실행 할 수 바인딩 (다른 개체 내에서 기능을있는 대부분의) 숫자 기능을 만들 것 :

이 내가 일을 조각 같이 할 수 있도록하려면 어떻게 비행 중에 내 타이머?

Answer 1

GlobalTimer 개체를 만들고 콜백 함수를 등록하고 자체를 취소 할 수있는 기능을 부여하십시오.

function makeGlobalTimer(freq) { 
    freq = freq || 1000; 

    // array of callback functions 
    var callbacks = []; 

    // register the global timer 
    var id = setInterval(
    function() { 
     var idx; 
     for (idx in callbacks) { 
     callbacks[idx](); 
     } 
    }, freq); 

    // return a Global Timer object 
    return { 
    "id": function() { return id; }, 
    "registerCallback": function(cb) { 
     callbacks.push(cb); 
    }, 
    "cancel": function() { 
     if (id !== null) { 
     clearInterval(id); 
     id = null; 
     } 
    } 
    }; 
} 

var gt = makeGlobalTimer(500); 
gt.registerCallback(function() { 
         console.log("a"); 
        }); 

gt.registerCallback(function() { 
         console.log("b"); 
        }); 

setTimeout(function() { gt.cancel(); }, 5000); 

Answer 2

이벤트가 발생합니다. 구독 기능은 이벤트를 청취하거나 자신의 논리에 따라 실행 여부를 선택할 수 있습니다. 것이이 일의

The jQuery way : 그럼 나중에 내부 otherObject

(function() { 
    setInterval(function() { 
    $(document).trigger('heartbeat-of-the-universe'); 
    }, 200); 
})(); 

...

$(document).bind('heartbeat-of-the-universe', this.cb); 

이벤트를 구현하는 다른 방법이 분명히 있습니다.

메모 메모의 Google 링크처럼, 이것은 최고의 성능을 가진 옵션이 아닙니다. 그러나 유연하고 상대적으로 관대합니다.

Answer 3

aekeus 방식의 약간 수정 된 버전입니다.

: - : 이제 pause- & 재개 타이머, 세 번째 arguments 및 빠른 callbacks -loop으로 (심지어 IE의 LT 9) 기본 setInterval 년대와 같은 arguments

function Interval(callback, freq) { 

    // array of callback functions 
    var args = arguments, 
     callbacks = [callback], 
     paused = false; 

    // register the global timer 
    var id = setInterval(function() { 
     if(paused) return; 
     var len = callbacks.length, 
      i = len; 
     while(i--) callbacks[len - 1 - i].apply(Interval, Array.prototype.slice.call(args, 2, args.length)); 
    }, freq); 

    // return a Global Timer object 
    return { 
     id: function() { 
      return id; 
     }, 
     add: function (cb) { 
      callbacks.push(cb); 
     }, 
     clear: function() { 
      if (id === null) return; 
      clearInterval(id); 
      id = null; 
     }, 
     pause: function(){ 
      paused = true; 
     }, 
     resume: function(){ 
      paused = false; 
     } 
    }; 
} 

당신은 추가에 전달할 수 있습니다

function callback(date) { 
    console.log(date); 
} 

var interval = Interval(callback, 1000, new Date); 

사용 예 : 여기

var interval = Interval(function() { 
    console.log("init", new Date); 
}, 1000); 

interval.add(function() { 
    console.log("a", new Date); 
}); 

interval.add(function() { 
    console.log("b", new Date); 
}); 

document.onmousedown = interval.pause; 
document.onmouseup = interval.resume;