How to wait 5 seconds in JavaScript? [SOLVED]

Waiting a set amount of time in JavaScript is a common task. Whether you need to pause for user input or to load data from a remote server, knowing how to wait 5 seconds in JavaScript can come in handy. In this article, we will show you how to do just that. In this article, we will discuss how to wait 5 seconds in JavaScript, and the method for doing so.

Use setTimeout to wait 5 seconds

Remember, JavaScript works synchronously typically, but with the setTimeout method we can delay some code to some specified time (say 5 seconds). The setTimeout method executes your code after the set delay expires. This global method works as an asynchronous method that will not pause the execution of other functions within the function stack.

The setTimeout method takes two main parameters - code, delay - to execute your code after a set time. The code parameter (a function that could be anonymous) is required, but the delay parameter is optional (and the default value is 0). We can have other additional parameters which are passed through to the function that we passed.

setTimeout(code, delay, arg1, ..., argN)

The code, as stated earlier, is a function (a callback function) that will contain code that we want to wait for a while before executing. The delay serves as the amount of time that we will wait the code for which is defined in milliseconds.

Now, let’s wait 5 seconds in JavaScript. To illustrate the wait effect, we will run other functions after the setTimeout code.

function multiply(arg1, arg2) {
    return arg1 * arg2;
}

function greetUser(user) {
    return `Welcome back, ${user}. Hope that coffee break was great?`;
}

function printJS() {
    console.log("JavaScript");
}

setTimeout(
    (user) => {
        console.log(`${user}, please provide your ID.`);
    },
    5000,
    "Jacob"
);

setTimeout(printJS, 1500);
console.log(multiply(3, 5));
console.log(greetUser("Jacob"));

Output

15
Welcome back, Jacob. Hope that coffee break was great?
JavaScript
Jacob, please provide your ID.

The multiply function result is logged first then the greetUser, and this is because these two functions are run synchronously within the function stack (from top to bottom). However, the printJS function that was present before multiply and greetUser function is returned after them, and that’s due to the use of the setTimeout at 1500 milliseconds (1.5 seconds). Finally, the anonymous function passed to the setTimeout method at 5000 milliseconds (5 seconds) is returned last. So, with the aid of the setTimeout method in JavaScript, we can wait 5 seconds to run a code section.

Summary

To wait 5 seconds in JavaScript, we need to make use of the setTimeout method which allows us to pass a function (or an anonymous function) and the delay parameter that will help define for how long we delay a code section.

References

setTimeout() - Web APIs | MDN (mozilla.org)