Sleep JavaScript: Descubra Como Cria-lo Da Forma Correta

Programador Viking 4 de setembro de 2023 0 Comentários Leitura: 4 min

Sleep JavaScript

Neste artigo vamos entender como criar um sleep Javascript e como fazer isso da forma correta utilizando uma outra técnica chamada setTimeout para substituir a função sleep.

Atualmente, no universo da programação em JavaScript, a capacidade de controlar o tempo de execução de tarefas é essencial para criar aplicações mais interativas e dinâmicas.

Embora muitas linguagens ofereçam uma função sleep para atrasar a execução de código, JavaScript adota uma abordagem diferente usando a função setTimeout.

Portanto, leia esse artigo até o final para entender como utilizar essa técnica que é muito mais eficiente.

Confira neste artigo:

Por que não há uma função sleep em JavaScript

Primeiramente vamos entender porque a linguagem JavaScript não possui uma função chamada sleep.

Ao contrário de algumas linguagens de programação, como Python, JavaScript não possui uma função sleep embutida que pause a execução do código por um período de tempo específico.

Isso acontece porque JavaScript é projetado para ser não bloqueante e assíncrono, o que significa que ele permite a execução de outras tarefas enquanto aguarda operações demoradas.

Ou seja, uma função sleep bloquearia toda a execução, o que não é desejável em aplicações que precisam ser responsivas e fluídas.

O que é setTimeout no JavaScript

Para criar atrasos na execução de código, JavaScript utiliza a função setTimeout. Essa função permite que você agende a execução de uma determinada tarefa após um período de tempo especificado.

Ou seja, o uso do setTimeout é ideal para tarefas que não precisam ser executadas imediatamente, como animações, atualizações de interface do usuário e requisições assíncronas.

Sintaxe básica do setTimeout

Agora que já entendemos o conceito, vamos aprender como funciona a sintaxe básica do setTimeout:

setTimeout(funcao, atrasoEmMilissegundos);

funcao: A função que você deseja executar após o atraso.
atrasoEmMilissegundos: O período de tempo que você deseja esperar em milissegundos antes de executar a função.

Veja também: Vale a pena investir em um treinamento online de JavaScript?

Como Usar o setTimeout

Agora que já entendemos a origem e a sintaxe do setTimeout, vamos ver alguns exemplos práticos de como utilizar essa função para criar atrasos na execução do código.

Exibindo uma mensagem após um atraso

Neste exemplo, vamos criar uma função simples que exibe uma mensagem no console após um atraso de 2 segundos usando o setTimeout.

function exibirMensagem() {
    console.log("A função foi executada após 2 segundos.");
}

setTimeout(exibirMensagem, 2000);

Neste caso, a função exibirMensagem será executada após um atraso de 2 segundos. Durante esse atraso, o programa pode continuar executando outras tarefas, mantendo a responsividade da aplicação.

Executando um código anônimo após um atraso

Às vezes, você pode querer executar um pedaço de código sem definir uma função separada. Isso pode ser feito usando um código anônimo dentro do setTimeout.

setTimeout(function() {
    console.log("Isso é um código anônimo executado após 3 segundos.");
}, 3000);

Nesse exemplo, o código dentro da função anônima será executado após um atraso de 3 segundos. Isso é útil quando você tem uma pequena tarefa a ser executada, mas não precisa criar uma função separada para ela.

Veja também: Vale a pena investir em um treinamento online de JavaScript?

Cancelando o agendamento

Às vezes, você pode querer cancelar a execução agendada de uma função usando o setTimeout. Isso pode ser útil, por exemplo, se uma condição for atendida antes que o atraso expire.

const timeoutId = setTimeout(function() {
    console.log("Isso será cancelado antes de ser executado.");
}, 5000);

// Para cancelar a execução agendada:
clearTimeout(timeoutId);

Neste exemplo, o setTimeout é configurado para executar uma função após 5 segundos. No entanto, logo em seguida, o clearTimeout é chamado para cancelar a execução agendada.

Ou seja, isso garante que a função não será executada, mesmo que o atraso ainda não tenha expirado.

Vantagens do setTimeout sobre sleep

Sleep JavaScript - Vantagens do setTimeout

Não bloqueante:
Enquanto sleep bloquearia toda a execução, o setTimeout permite que outras tarefas sejam executadas durante o atraso.

Ideal para tarefas assíncronas:
Como JavaScript é amplamente usado para operações assíncronas, o setTimeout se encaixa bem nesse paradigma.

Responsividade:
Utilizar o setTimeout ajuda a manter a interface do usuário responsiva, garantindo que a aplicação não pareça travada durante a espera.

Conclusão: Sleep JavaScript

Em conclusão, embora JavaScript não disponha de uma função sleep para atrasar a execução de código, a função setTimeout oferece uma abordagem mais adequada para controlar a temporização das tarefas.

Seu caráter assíncrono e não bloqueante se alinha com a natureza da linguagem e é uma ferramenta valiosa para criar interações dinâmicas em aplicações web.

Portanto, dominar o uso do setTimeout é essencial para qualquer desenvolvedor JavaScript que deseja criar aplicações fluídas e responsivas.

O segredo para alcançar o topo da sua carreira na área da tecnologia está a um clique de distância. Toque no botão abaixo agora mesmo e mergulhe em mais de 1400 cursos completos, todos com certificados de peso.

ACESSAR CURSOS COM CERTIFICADO

Enfim, espero que tenha gostado do conteúdo pois preparamos ele para realmente te ajudar em sua jornada de estudos.

Um forte abraço!