Need Help Coding a Loop Using "For" Statement in JavaScript

Question

I need to make a countdown happen from 10 to 0 using a loop. The loop should replace the need to repeat the code 10X. I also neeed to display the countdown to the user in the HTML. Help!

<script>
       
function StartTheCountdown()
{ 
     var Countdown = 10;
     // Used to keep track of actual time.
     // 1000 = 1 second because we are using milliseconds.
    var timeout = 10000;
    setTimeout(() => {
    document.getElementById("CountDownDisplay").innerHTML = "Blastoff!";
    Countdown = Countdown - 1;
    }, timeout)
    timeout = timeout - 1000;
    // We need to do this 10 times **************************************
    setTimeout(() => {
    document.getElementById("CountDownDisplay").innerHTML = Countdown;
    Countdown = Countdown - 1;
    }, timeout)
    timeout = timeout - 1000; 
}
    </script>

Check out W3schools for for loop examples in javascript https://www.w3schools.com/js/js_loop_for.asp — Rhett Harrison, Nov 30 '21 at 20:52
Please see [How do I add a delay in a JavaScript loop?](/q/3583724/4642212). — Sebastian Simon, Nov 30 '21 at 21:02

score 0 · Answer 1 · answered Nov 30 '21 at 21:01

Use setTimeout to repeatedly call the function until count is zero, and then display a message.

// Cache your element
const div = document.querySelector('div');

// Initialise your count to 10
function countdown(count = 10) {

  // Update your element textContent
  div.textContent = `T-minus: ${count}`;

  // Call the function again if the count
  // is greater than 0 with a decremented count
  if (count > 0) {
    setTimeout(countdown, 1000, --count);

  // Otherwise update the textContent of the
  // element with a message
  } else {
    div.textContent = 'Blast off!';
  }
}

countdown();

<div></div>

Additional documentation

Template/string literals

Need Help Coding a Loop Using "For" Statement in JavaScript

1 Answers1