DEV Community

Fernando Junior
Fernando Junior

Posted on

setTimeout e setInterval

Chegamos a mais um post da minha saga de estudos em JavaScript.

No post de hoje irei falar um pouco sobre os métodos setTimeout e setInterval.

setTimeout

O método setTimeout é usado para executarmos uma função após um determinado tempo, esta função será executada uma única vez.

Este método recebe dois argumentos:

  • 1: A função que será executada após o tempo informado
  • 2: O tempo que deve ser esperado para executar a função do primeiro argumento, esse tempo deve ser informado em milissegundos.
setTimeout(() => {
 console.log('Execução do setTimeout!')
}, 2000)
Enter fullscreen mode Exit fullscreen mode

Levando em consideração o código de exemplo acima, após o carregamento da página, será aguardado 2 segundos para executar a função, que no nosso caso é apenas informar no console a string Execução do setTimeout.

setInterval

Já o método setInterval, é usado para ficar executando uma função no intervalo de tempo que foi determinado.

Este método também recebe dois argumentos:

  • 1: A função que ficará sendo executada
  • 2: De quanto em quanto tempo essa função será executada, também em milissegundos.
setInterval(() => {
 console.log('Execução do setInterval!')
}, 2000)
Enter fullscreen mode Exit fullscreen mode

Observando o código de exemplo acima, a função passada como primeiro argumento ficará sendo executada a cada 2 segundos, logo, a cada 2 segundos será impresso no console a string Execução do setInterval!.

Desta forma, esse setInterval ficará sendo executado indefinidamente, pois não foi informado um momento para que esse execução seja parada.

Para fazermos isso, devemos usar um método chamado clearInterval. Observe o código abaixo:

let counter = 0

const timer = setInterval(() => {
 console.log('Execução do setInterval!')
 counter++

 if (counter === 5) {
  clearInterval(timer)
 }
}, 2000)
Enter fullscreen mode Exit fullscreen mode

Como pode ser observado acima, usei o método clearInterval para parar a execução do código assim que a variável counter fosse igual a 5.

Com isso, a cada dois segundos será impresso no console Execução do setInterval e a variável counter será incrementada, assim que essa variável atingir o valor 5, cairemos na condição do if e com isso, o método clearInterval será executado, parando a execução da const timer.

Por hoje é isso, espero que estejam curtindo as postagens!

Vou deixar aqui abaixo o link do MDN com a documentação sobre setTimeout e sobre setInterval


Esse foi mais um post da minha saga de estudos em JavaScript Vanilla. Espero que estejam gostando!

Qualquer dúvida ou sugestão, vocês me encontram nas minhas redes sociais:

LinkedIn
GIthub
Twitter

Top comments (0)