Eventos de tempo em JavaScript

Eventos de tempo em JavaScript
Eventos que são disparados em um intervalo de tempo específico para executar o JavaScript O código é conhecido como eventos de tempo. Eles podem ser usados ​​para atrasar a execução do código ou para executar um bloco de código repetidamente após um intervalo de tempo específico. Esses eventos são chamados de métodos globais, pois estão diretamente disponíveis no Html dom e pode ser invocado de qualquer lugar do código.

Como executar o código JavaScript após um intervalo de tempo específico

Executar JavaScript código após um intervalo de tempo específico, o objeto da janela é usado.

Existem dois métodos principais/básicos, usados ​​para eventos de tempo:

  • Função setTimeout ()
  • função setInterval ()

Ambas as funções acima são usadas para executar um bloco de código fornecido a eles como uma função para executar em um intervalo de tempo especificado, mas com uma diferença sutil. Vamos começar olhando para as sintaxes das funções e das diferenças entre essas sintaxes:

função settimeout () em javascript

A sintaxe de Função setTimeout () é:

Settimeout (função, TimeInterval)
// ou
janela.Settimeout (função, TimeInterval)

Como sabemos que o objeto da janela é usado para executar o código JavaScript após um intervalo de tempo especificado, mas mesmo se não usarmos o objeto de janela com o setTimeout () ou função setInterval (), Ambos vão funcionar da mesma forma.

O Função setTimeout () leva dois argumentos como parâmetros:

  • Um é uma função que precisa ser executada
  • O segundo é um intervalo de tempo em milissegundos, após o que a função especificada no primeiro parâmetro será executada.

O Função setTimeout () é usado para executar a função fornecida uma vez depois de esperar que o intervalo de tempo seja concluído.

Como parar a execução da função setTimeout ()

Às vezes, precisamos interromper a execução da função definida/chamada no Função setTimeout () Antes mesmo que o tempo mencionado seja alcançado. Por exemplo, ao carregar os dados do servidor, mostramos carregadores no aplicativo da web, quando os dados são buscados antes do tempo esperado, podemos simplesmente parar o carregador e mostrar os dados.

função cleartimeout () em javascript

Para parar a execução do Função setTimeout (), o função cleartimeout () é usado:

Sintaxe

A sintaxe do função cleartimeout () é:

ClearTimeout (setTimeOutVariable)

O função cleartimeout () Apenas pega o nome da variável que foi retornado pela função setTimeout ().

Por exemplo, se chamamos o Função setTimeout ():

holdExec = setTimeout (() =>
console.log (feito);
, 5000)

Agora, para parar a execução do Função setTimeout () Antes que o intervalo de tempo seja concluído, temos que fornecer o “HoldExec”Variável como argumento para o função cleartimeout () e a função cleartimeout () iria assim:

ClearTimeout (HoldExec);

Se a função dentro do Função setTimeout () não é executado, então a execução do Função setTimeout () será interrompido.

função setInterval () em javascript

O função setInterval () e sua sintaxe é quase a mesma que Função setTimeout () No entanto, a única diferença entre eles é que o função setInterval () continua executando a função continuamente depois de atingir o intervalo de tempo.

A sintaxe de função setInterval é:

SetInterval (função, TimeInterval)

O função setInterval () Também leva dois argumentos como parâmetros:

  • Uma é uma função que precisa ser executada todas as vezes após o intervalo de tempo especificado.
  • O segundo parâmetro é um intervalo de tempo, após o qual a função será executada repetidamente.

Agora, a pergunta surge aqui, se o função setInterval () continua executando a função continuamente, então como podemos parar a execução? A próxima seção explicará:

Como interromper a execução da função setInterval ()

Bem, assim como o função cleartimeout (), Também temos a opção de interromper a execução do função setInterval ().

função clearInterval () em javascript

Para parar a execução do função setInterval (), o função clearInterval () é usado:

Sintaxe

A sintaxe do função clearInterval () é:

ClearInterval (setInterValVariable)

O função clearInterval () apenas leva o nome da variável que foi devolvido pelo função setInterval ().

Por exemplo, se chamamos o função setInterval ():

holdExec = setInterval (() =>
console.log (segurando…);
, 100)

Agora, para parar a execução do função setInterval () Sempre que queremos, apenas temos que fornecer o “HoldExec”Variável como argumento para o função clearInterval () e a função clearInterval () iria assim:

ClearInterval (HoldExec);

A execução do função setInterval () será interrompido quando você executar o mencionado acima função clearInterval ().

Conclusão

O JavaScript oferece aos programadores vários métodos para executar de forma assíncrona um bloco de código; Esses métodos são chamados de eventos de tempo. Os eventos de tempo permitem a execução periódica do código JavaScript; Eles também permitem ao programador atrasar a execução de certos blocos de código. Neste tutorial, abordamos o básico dos eventos de tempo em JavaScript; Aprendemos o que são e como usá -los em nosso código.