How can I nest setInterval and setTimeout in my function?

Question

Good Morning,

I have a javascript function which, in turn, calls several functions. I would like to trigger the function (check1 in my example below) half a second after the javascript function is called and subsequently call the same function check1 every 10 seconds (10000 milliseconds). Having done some researches, I found out - I might be wrong though - that the combination of setInterval and setTimeout would have made the deal.

Unfortunately, the outcome was not as expected.

Afterwards, I made a second trial by using the clearInterval() but I was not sure either how to nest these various functions.

Is there an elegant and smart way to achieve this ? Many thanks in advance for your help

Here below is my javascript code:

// Global variables
var AutoScript = false;
var IntervalRefresh1 = 500;
var newIntervalDefined1 = false;

// calls the startUp method
startUp();


function startUp()
{
  console.log("I'm the startup2");
  setInterval(check1, IntervalRefresh1);
}


function check1()
{
  $.ajax({
  type: 'POST',
  url: 'php/checker1.php',
  dataType: 'json',
  data: {
  counter:$('#message-list').data('counter')
  }
  }).done(function( response ) {
  /* check if with response we got a new update */
  if(response.update==true)
  {
    var j = response.news;      
    $('#message-list').html(response.news);
    AutoScript = true;
    // here I call a specific method named after getDataFromDatabase(j);
    AutoScript = false;        
    if (newIntervalDefined1 == false)
    {
      setTimeout(check1, 10000);
      newIntervalDefined1 == true;
    }
  }
  });
}

Answer 1

The problem is you're calling check1 in an interval but not clearing it. So this will keep getting called every 500 miliseconds.

setInterval(check1, IntervalRefresh1);

On the top, you're calling the function again with setTimeout. You must clear that too at some point based on a condition so that it doesn't run infinitely. See the code and comments.

var timerinterval;
var timeout;
function startUp()
{
  console.log("I'm the startup2");
  timerinterval = window.setInterval(check1, IntervalRefresh1); //set a timerInterval
}


function check1()
{
  $.ajax({
  type: 'POST',
  url: 'php/checker1.php',
  dataType: 'json',
  data: {
  counter:$('#message-list').data('counter')
  }
  }).done(function( response ) {
  /* check if with response we got a new update */
  if(response.update==true)
  {
    var j = response.news;      
    $('#message-list').html(response.news);
    AutoScript = true;
    // here I call a specific method named after getDataFromDatabase(j);
    AutoScript = false;        
    if (newIntervalDefined1 == false)
    {
      clearInterval(timerinterval); //clear the interval timer
     timeout =  setTimeout(check1, 10000); //now clear this too at some point of time so that it doesn run infinitely
      newIntervalDefined1 == true;
    }
  }
  });