How to use setTimeout(), after all promise done?

user_2452021 0
Viewed 73

I tried to set timeout to promise function after all promise is finish but it's not working. See my code.

function cashierPromise() {
  return new Promise(function(resolve, reject) {
    resolve();
  });
}

function pharPromise() {
  return new Promise(function(resolve, reject) {
    resolve();
  });
}


$(document).ready(function() {
  $('#test1').click(function() {

    Promise.all([cashierPromise(), pharPromise()])
      .then(values => {
        console.log('promise all')
        setTimeout(cashierPromise, 5000);
        setTimeout(pharPromise, 5000);
      })
      .catch(error => {
        console.log(error.message)
      });
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button type="button" id="test1" class="btn">TEST1</button>

it be like this or not ? [cashierPromise, pharPromise] -> All Done-> Re Call -> All Done -> Re Call

javascript
3 Answers

What I understand, I think what you want to achieve is this. Call this same function again after some interval. Correct me if I'm wrong.

$(document).ready(function () {
    $('#test1').click(runPromise);
});

function runPromise() {
    Promise.all([cashierPromise(), pharPromise()])
        .then(values => {
            console.log('promise all')
            setTimeout(runPromise, 5000);
        })
        .catch(error => { 
          console.log(error.message)
        });
}
user_50481120

If I understand correctly, you want the promises to be executed indefinitely after the button is clicked.

One way to achieve that would be:

function cashierPromise() {
  return new Promise(function(resolve, reject) {
    console.log('cashierPromise')
    resolve();
  });
}

function pharPromise() {
  return new Promise(function(resolve, reject) {
    console.log('pharPromise')
    resolve();
  });
}

/* Introduce an interation function to encapsualte logic for a single
iteration/cycle of the function calls */
function iteration(number) {

  number = number || 0;
  console.log(`iteration:${number}`);

  Promise.all([cashierPromise(), pharPromise()])
    .catch(error => {
      console.log(error.message)
    })
    .then(() => {

      /* Impose 5second delay */
      return new Promise((resolve) => setTimeout(resolve, 5000))
    })
    .then(() => {

      /* Re-run iteration causing the cashierPromise() and pharPromise() 
      function to be called again */
      iteration(number + 1);
    });

}

$(document).ready(function() {


  $('#test1').click(function() {
    /* Invoke first iteration to call the two promises */
    iteration();
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<button type="button" id="test1" class="btn">TEST1</button>

user_85267050

How about using async/await?

function cashierPromise() {
  return new Promise(function(resolve, reject) {
    resolve();
  });
}

function pharPromise() {
  return new Promise(function(resolve, reject) {
    resolve();
  });
}

function wait(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

$(document).ready(function() {
  $('#test1').click(async function() {

    try {
      for(;;) {
        const value = await Promise.all([cashierPromise(), pharPromise()]);
        console.log('promise all');
        await wait(5000);
      }
    } catch(error) {
      console.log(error.message)
    }
    
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button type="button" id="test1" class="btn">TEST1</button>

user_1285110
Related