Выполнить функцию setInterval без задержки в первый раз

Здесь есть способ настроить метод setInterval javascript для немедленного выполнения метода и затем выполняется с помощью таймера

ОТВЕТЫ

Ответ 1

Проще всего просто вызвать функцию непосредственно в первый раз:

foo();
setInterval(foo, delay);

Однако есть веские причины, чтобы избежать setInterval - в частности, в некоторых случаях вся загрузка событий setInterval может прибыть сразу после друг друга без какой-либо задержки. Другая причина заключается в том, что если вы хотите остановить цикл, вы должны явно вызвать clearInterval, что означает, что вы должны помнить дескриптор, возвращенный из исходного вызова setInterval.

Таким образом, альтернативный метод состоит в том, чтобы foo запускать сам для последующих вызовов, используя setTimeout вместо этого:

function foo() {
   // do stuff
   // ...

   // and schedule a repeat
   setTimeout(foo, delay);
}

// start the cycle
foo();

Это гарантирует, что между вызовами существует как минимум интервал delay. Это также упрощает отмену цикла, если это необходимо - вы просто не вызываете setTimeout, когда достигнуто условие завершения цикла.

Еще лучше, вы можете обернуть это все в сразу вызываемое выражение функции, которое создает функцию, которая затем снова вызывает себя, как указано выше, и автоматически запускает цикл:

(function foo() {
    ...
    setTimeout(foo, delay);
})();

который определяет функцию и запускает цикл за один раз.

Ответ 2

Я не уверен, правильно ли я понимаю вас, но вы можете легко сделать что-то вроде этого:

setInterval(function hello() {
  console.log('world');
  return hello;
}(), 5000);

Очевидно, существует множество способов сделать это, но это самый сжатый способ, о котором я могу думать.

Ответ 3

Вот обертка, чтобы красиво, если вам это нужно:

(function() {
    var originalSetInterval = window.setInterval;

    window.setInterval = function(fn, delay, runImmediately) {
        if(runImmediately) fn();
        return originalSetInterval(fn, delay);
    };
})();

Установите для третьего аргумента setInterval значение true, и он будет запущен в первый раз сразу после вызова setInterval:

setInterval(function() { console.log("hello world"); }, 5000, true);

Или пропустите третий аргумент, и он сохранит свое первоначальное поведение:

setInterval(function() { console.log("hello world"); }, 5000);

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

Ответ 4

Я наткнулся на этот вопрос из-за одной и той же проблемы, но ни один из ответов не поможет, если вам нужно вести себя точно так же, как setInterval(), но с той лишь разницей, что функция вызывается сразу в начале.

Вот мое решение этой проблемы:

function setIntervalImmediately(func, interval) {
  func();
  return setInterval(func, interval);
}

Преимущество этого решения:

  • существующий код с помощью setInterval может быть легко адаптирован путем замены
  • работает в строгом режиме
  • он работает с существующими именованными функциями и закрывает
  • вы все равно можете использовать возвращаемое значение и передать его на clearInterval() позже

Пример:

// create 1 second interval with immediate execution
var myInterval = setIntervalImmediately( _ => {
        console.log('hello');
    }, 1000);

// clear interval after 4.5 seconds
setTimeout( _ => {
        clearInterval(myInterval);
    }, 4500);

Чтобы быть нахальным, если вам действительно нужно использовать setInterval, вы также можете заменить оригинал setInterval. Следовательно, при добавлении этого кода перед вашим существующим кодом не требуется изменения кода:

var setIntervalOrig = setInterval;

setInterval = function(func, interval) {
    func();
    return setIntervalOrig(func, interval);
}

Тем не менее, все преимущества, перечисленные выше, применяются здесь, но замена не требуется.

Ответ 5

Вы можете обернуть setInterval() в функцию, которая обеспечивает это поведение:

function instantGratification( fn, delay ) {
    fn();
    setInterval( fn, delay );
}

... затем используйте его следующим образом:

instantGratification( function() {
    console.log( 'invoked' );
}, 3000);

Ответ 6

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

Ответ 7

// YCombinator
function anonymous(fnc) {
  return function() {
    fnc.apply(fnc, arguments);
    return fnc;
  }
}

// Invoking the first time:
setInterval(anonymous(function() {
  console.log("bar");
})(), 4000);

// Not invoking the first time:
setInterval(anonymous(function() {
  console.log("foo");
}), 4000);
// Or simple:
setInterval(function() {
  console.log("baz");
}, 4000);

Ответ 8

Я предлагаю вызывать функции в следующей последовательности

var _timer = setInterval(foo, delay, params);
foo(params)

Вы также можете передать _timer в foo, если вы хотите clearInterval(_timer) при определенном условии

var _timer = setInterval(function() { foo(_timer, params) }, delay);
foo(_timer, params);

Ответ 9

Чтобы решить эту проблему, я запускаю функцию в первый раз после загрузки страницы.

function foo(){ ... }

window.onload = function() {
   foo();
};

window.setInterval(function()
{
    foo(); 
}, 5000);

Ответ 10

Использование:

function poll(f, i){
  var cancel = false;
  function again(){
    f();
    cancel || setTimeout(again, i);
  }
  again();
  return function(){
    cancel = true;
  }
}

poll(task, 1000);

С помощью эффектов пользовательского интерфейса составьте anim в poll, чтобы еще больше уменьшить накладные расходы:

function anim(f){
  var waf = window.requestAnimationFrame; //browser support?
  return waf ? function(){
    waf(f)
  } : f;
}

poll(anim(taskUI), 1000);

Ответ 11

Есть удобный пакет npm под названием firstInterval (полное раскрытие, оно мое).

Многие из приведенных здесь примеров не включают обработку параметров, и изменение поведения по умолчанию setInterval в любом крупном проекте - зло. Из документов:

Этот шаблон

setInterval(callback, 1000, p1, p2);
callback(p1, p2);

идентично

firstInterval(callback, 1000, p1, p2);

Если вы работаете в браузере по старому стилю и не хотите зависимости, это легко вырезать и вставить из кода.

Ответ 12

Для кого-то нужно принести внешнее this внутрь, как будто это функция стрелки.

(function f() {
    this.emit("...");
    setTimeout(f.bind(this), 1000);
}).bind(this)();

Если вышеуказанное производство мусора беспокоит вас, вы можете вместо этого сделать закрытие.

(that => {
    (function f() {
        that.emit("...");
        setTimeout(f, 1000);
    })();
})(this);

Или, возможно, рассмотрите возможность использования декоратора @autobind зависимости от вашего кода.

Ответ 13

Здесь простая версия для новичков без всего возни. Он просто объявляет функцию, вызывает ее, затем запускает интервал. Это.

//Declare your function here
function My_Function(){
  console.log("foo");
}    

//Call the function first
My_Function();

//Set the interval
var interval = window.setInterval( My_Function, 500 );

Ответ 14

Проблема с немедленным асинхронным вызовом вашей функции, поскольку стандартный setTimeout/setInterval имеет минимальный тайм-аут около нескольких миллисекунд, даже если вы прямо установили его в 0. Это вызвано спецификой работы браузера.

Пример кода с нулевой задержкой REAL, которая работает в Chrome, Safari, Opera

function setZeroTimeout(callback) {
var channel = new MessageChannel();
channel.port1.onmessage = callback;
channel.port2.postMessage('');
}

Вы можете найти дополнительную информацию здесь

И после первого ручного вызова вы можете создать интервал с вашей функцией.

Ответ 15

на самом деле самое быстрое выполнение

interval = setInterval(myFunction(),45000)

это вызовет myfunction, а затем сделает это agaian каждые 45 секунд, что отличается от выполнения

interval = setInterval(myfunction, 45000)

который не будет называть его, но расписал его только