Использование цикла для установки нескольких тайм-аутов для функции

Я использую Moment.js для обработки времени. 10 Внутренние объекты (продолжительность) были правильно определены с временем начала и окончания, как показано в JSFiddle этого вопроса.

Этот скрипт предназначен для использования разницы между время окончания и настоящее, чтобы определить необходимое Timeout, которое должно быть установлено для вызова функции endInning(). Это реализовано в цикле для обработки 10 иннингов.

for (x = 0; x < 10; x++) { // for each of ten defined innings

    // calculate the difference between the end of inning x and now
    timeTillEnd = moment(Game.innings[x].start).diff(moment(now),"milliseconds");

    // and set the necessary delay
    setTimeout(function () { 
        endInning(x);
    }, timeTillEnd);

}

Однако вместо увеличения задержки на 12 часов каждая задержка остается неизменной.

Результат:

  • Окончание тайма 1 в пятницу, 12:00, 412712000 мс с сейчас.

  • Окончание тайма 2 в пятницу, 12:00, 412712000 мс с сейчас.

  • Окончание тайма 3 в пятницу, 12:00, 412712000 мс с сейчас.

  • ...и так далее до 10-го иннинга.

В чем моя ошибка и как ее исправить?

Редактирует:

После того, как я задал вопросы, связанные с моими практиками с этим скриптом, я думаю, что эти вопросы/ответы связаны:

Итак, мой вопрос звучит так: Как я могу применить эту практику? для моей конкретной ситуации?


javascript timeout momentjs settimeout
person Community    schedule 30.03.2014    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Фактическая проблема с датами окончания не связана с тайм-аутами (однако с ними все еще проблема)

сначала — вы создали один объект inning, а вам нужно создать 10

Итак, двигайся

var inning = new Object();

внутри первого цикла for таким образом вы создадите 10 иннинг-объектов вместо одного.

во-вторых — вы неправильно использовали moment библиотечный объект

inning.start = beginning.moment.add("hours", (inningHours * x)); //WRONG

вы только что изменили переменную first.moment, а это не то, чего вы пытаетесь достичь!

В javascript все объекты передаются по ссылкам https://stackoverflow.com/a/16880456/870183< /а>

Итак, вы должны создать новый объект момента, а затем изменить его.

inning.start = moment(beginning.moment).add("hours", (inningHours * x)); //correct

третий — проблема с тайм-аутом. Для каждого тайм-аута нам нужно создать другую функцию с другой переменной x.

Мне было трудно понять замыкания, так что продолжайте пробовать. https://stackoverflow.com/a/111200/870183

Давайте создадим функцию, которая будет возвращать другую функцию

function endInningFunc(x){
    return function () {
        endInning(x)
    }
}

а затем мы передадим новую функцию, где x будет "заблокирован" до своего значения в setTimeout

setTimeout(endInningFunc(x), timeTillEnd);

последнее, не используйте глобальные переменные! http://www.webdevelopersnotes.com/tutorials/javascript/global_local_variables_scope_javascript.php3

например, for (var x=0);

наконец, рабочий пример. http://jsfiddle.net/LmuX6/13/

person Sanya_Zol    schedule 02.04.2014
comment
Ответ Акшая предоставил необходимую информацию, но этот дает много дополнительной помощи. Спасибо за ваше время. - person ; 03.04.2014

arrow_upward
1
arrow_downward 

function doSetTimeout(i) {
  setTimeout(function() { alert(i); }, 100);
}

for (var i = 1; i <= 2; ++i) {
  doSetTimeout(i);
}

скопировал его из setTimeout в цикле for не печатает подряд values Я не буду использовать его, если я слишком много зацикливаюсь, так как каждый вызов функции создает новый объект функции, и если вы слишком много зацикливаетесь, это будет интенсивно использовать память, альтернативой может быть создание структуры, подобной классу. пример http://www.phpied.com/3-ways-to-define-a-javascript-class/

function Inning(x) {
    this.x= x;
}

Inning.prototype.onTimeOut = function() {
    // do your thing with this.x
};
person Akshay Ransing    schedule 02.04.2014