Como criar atraso de 5 segundos para uma função com JavaScript

Em determinadas situações, pode ser necessário adicionar um atraso de tempo antes de executar uma função em JavaScript.

Neste artigo, exploraremos diferentes métodos para criar um atraso de 5 segundos antes de executar uma função específica.

Acompanhe o Blog e o meu Curso de Angular ou Curso de Javascript, Ts e Nodejs

Timer setTimeout()

O método setTimeout() é uma maneira comum de criar atrasos em JavaScript. Ele permite definir um intervalo de tempo em milissegundos antes de executar uma função. Veja o exemplo abaixo:

function minhaFuncao() {
  console.log('A função foi executada após 5 segundos');
}

setTimeout(minhaFuncao, 5000);

Nesse exemplo, a função minhaFuncao() será executada após um atraso de 5 segundos.

Promises e async/await

Com o uso de Promises e async/await, podemos criar um atraso de 5 segundos de forma mais elegante. Veja o exemplo abaixo:

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

async function minhaFuncao() {
  await esperar(5000);
  console.log('A função foi executada após 5 segundos');
}

minhaFuncao();

Nesse exemplo, a função esperar() retorna uma Promise que é resolvida após o tempo especificado em milissegundos. A função minhaFuncao() utiliza o await para aguardar o término do atraso de 5 segundos antes de executar o console.log().

Acompanhe o Blog e o meu Curso de Angular ou Curso de Javascript, Ts e Nodejs

setInterval() e clearInterval()

Outra abordagem é utilizar o setInterval() em conjunto com o clearInterval() para criar um atraso de 5 segundos. Veja o exemplo abaixo:

function minhaFuncao() {
  console.log('A função foi executada após 5 segundos');
  clearInterval(intervalId);
}

let intervalId = setInterval(minhaFuncao, 1000);

setTimeout(() => {
  clearInterval(intervalId);
}, 5000);

Nesse exemplo, a função minhaFuncao() é executada a cada segundo pelo setInterval(). Após 5 segundos, o clearInterval() é chamado para interromper a execução contínua da função.

Conclusão

Criar um atraso de tempo antes de executar uma função pode ser útil em muitas situações. Neste artigo, exploramos três métodos diferentes: setTimeout(), Promises e async/await, e setInterval() em conjunto com clearInterval().

Escolha o método que melhor se adequa às suas necessidades e adicione a funcionalidade de atraso de 5 segundos às suas funções JavaScript.