Простой счетчик с прослушивателем и обратным вызовом

Question

У меня есть простой класс ниже, который начинается, а затем обновляет счет каждую секунду. Как я могу добавить функциональность для прослушивания определенного значения, а затем запустить обратный вызов?

function Counter() { 
    this.currentCount = 0; 
} 

Counter.prototype.start = function() { 
    setInterval(this.update, 1000); 
}; 

Counter.prototype.when = function(value, callback) { 
    callback(value); 
}; 

Counter.prototype.update = function() { 
    this.currentCount++; 
}; 

В моем сознании это будет работать примерно так.

var counter = new Counter(); 
counter.when(50, function(value) { 
    console.log('We arrived at ' + value + ', the requested value.'); 
}); 
counter.start(); 

Answer 1

Это просто хороший домашнее задание, я сделаю это для вас;) Пожалуйста, посмотрите на мое решение:

function Counter() { 
    this.currentCount = 0; 
    this.conditions = []; 
    this.interval = undefined; 
} 

Counter.prototype.start = function() { 
    if (!this.interval) { 
     var that = this; 
     this.interval = setInterval(function() { 
      that.update(); 
     }, 1000); 
    } 
}; 

Counter.prototype.stop = function() { 
    if (this.interval) { 
     clearInterval(this.interval); 
     this.interval = undefined; 
    } 
    this.currentCount = 0; 
}; 

Counter.prototype.when = function(value, callback) { 
    var that = this; 
    this.conditions.push(function() { 
     if (that.currentCount === value) { 
      callback.call(that, value); 
     } 
    }); 
}; 

Counter.prototype.update = function() { 
    this.currentCount++; 
    for (var i = 0, l = this.conditions.length; i < l; i++) { 
     var condition = this.conditions[i]; 
     condition(); 
    } 
}; 

var counter = new Counter(); 
counter.when(50, function(value) { 
    console.log('We arrived at ' + value + ', the requested value.'); 
}); 
counter.when(60, function (value) { 
    console.log('Stop at ' + value + '!'); 
    this.stop(); 
}); 
counter.start(); 

и это fiddled!

Другой ответ здесь дал хороший аргумент в сокрытии частных переменных, но реализовал его немного смущенно, так что это еще один способ сделать его похожим. Вместо общих функций прототипа это использует функции экземпляра. Некоторые могут сказать, что это требует большего объема памяти, но я не считаю, что это важно, и позволяет легко иметь рядовых в реальной функции конструктора.

var Counter = function() { 
    var that = this, currentCount = 0, 
     conditions = [], interval; 
    var update = function() { 
     currentCount++; 
     for (var i = 0, l = conditions.length; i < l; i++) { 
      var condition = conditions[i]; 
      condition(); 
     } 
    }; 
    this.start = function() { 
     if (!interval) { 
      interval = setInterval(function() { 
       update.call(that); 
      }, 1000); 
     } 
    }; 
    this.when = function (value, callback) { 
     conditions.push(function() { 
      if (currentCount === value) { 
       callback.call(that, value); 
      } 
     }); 
    }; 
    this.stop = function() { 
     if (interval) { 
      clearInterval(interval); 
      interval = undefined; 
     } 
     currentCount = 0; 
    }; 
}; 

var counter = new Counter(); 
counter.when(50, function(value) { 
    console.log('We arrived at ' + value + ', the requested value.'); 
}); 
counter.when(60, function (value) { 
    console.log('Stop at ' + value + '!'); 
    this.stop(); 
}); 
counter.start(); 

посмотреть его fiddled!

Обратите также внимание, что в обоих примерах counter является instanceof Counter и Object,
тогда Counter является instanceof Function и Object (почему мне нравится писать так много кода;))

Answer 2

Для поддержки нескольких Whens:

Добавить массив Whens в своем классе:

function Counter() { 
    this.currentCount = 0; 
    this.whens = []; 
} 

Тогда пусть когда функция толчок, что:

Counter.prototype.when = function(value, callback) { 
this.whens.push({'time' : value, 'callback' : callback}); 
} 

И чек для них, когда они были обновлены:

Counter.prototype.update = function() { 
    this.currentCount++; 

    for(var w in this.whens) { 
     if(this.currentCount == this.whens[w].time) { 
      this.whens[w].callback(); 
     } 
    } 
} 

Answer 3

Попробуйте что-нибудь подобное:

function Counter(interval, val, func){ 
    this.currentCount = 0; 
    setInterval(function(){ 
    this.currentCount++; 
    if(this.currentCount === val)func(); 
    }, interval); 
} 
var nc = new Counter(1000, 50, function(){ 
    console.log('We have arrived at '+nc.currrentCount); 
}); 

Answer 4

Существует аргумент, чтобы сделать что-то вместо этого:

var Counter = (function() { 
    var update = function() { 
     var idx, callbacks; 
     this.currentCount++; 
     callbacks = this.callbacks[this.currentCount]; 
     if (callbacks) { 
      for (idx = 0; idx < callbacks.length; idx++) { 
       callbacks[idx](this.currentCount); 
      } 
     } 
    }; 
    var start = function() { 
     var counter = this; 
     setInterval(function() {update.call(counter)}, 1000); 
    }; 
    var when = function(count, callback) { 
     (this.callbacks[count] || (this.callbacks[count] = [])).push(callback); 
    }; 
    return function() { 
     var config = {currentCount: 0, callbacks: {}}; 
     this.start = function() {return start.call(config);}; 
     this.when = function(count, callback) { 
      return when.call(config, count, callback); 
     }; 
     // this.stop = ... // if desired 
    }; 
}()); 

Это несколько более интенсивный объем памяти, чем версия кода на основе прототипов. Я бы не использовал его для чего-то, где вы ожидали сотни тысяч или миллионы объектов. Но это имеет то преимущество, что оно действительно инкапсулирует данные, которые вы хотели бы скрывать, например, currentCount и список обратных вызовов. Он не предоставляет ненужную функцию update. И это не ужасно тяжелее прототипа. Каждый экземпляр имеет свои собственные функции start и when, но это только тонкие обертки вокруг общих функций.

Сложно добавить функцию stop к этому точно так же, если вы не возражаете против воздействия на результат setInterval. Но это выполнимо.