Interface com o usuário com JavaScript – Método alert()

JavaScript reina no desenvolvimento web e, neste artigo, exploramos o método alert(), suas nuances, limitações e alternativas modernas.

Deixe seu like:

Avatar


31/01/2024 | 17:41Atualizado há 19 dias

Fala, meus consagrados! Beleza?

JavaScript se estabeleceu como uma das linguagens de programação mais influentes no desenvolvimento web. Uma de suas funcionalidades básicas, mas essenciais, é o método alert(), usado para criar interações simples com o usuário.

Neste artigo, teremos uma visão detalhada sobre o método alert() em JavaScript. Exploraremos desde sua sintaxe básica até implicações na experiência do usuário, abordando também suas limitações e alternativas modernas.

O método alert() vem do objeto window em JavaScript. Ele exibe uma caixa de diálogo com uma mensagem especificada e um botão “OK”. O objetivo principal é informar o usuário ou confirmar que alguma ação foi executada. Esse método exibe uma caixa de alerta com uma mensagem e um botão OK é usado quando se deseja que as informações cheguem ao usuário.

A sintaxe básica do alert() é simples:

alert(mensagem);

window.alert(mensagem);

O parâmetro mensagem representa a mensagem da caixa de alerta.

Exemplo 1:

<!DOCTYPE html>

<html>

<body>

<h2>Método alert()</h2>

<script>

alert(5 + 6);

</script>

</body>

</html>

Resultado da execução do script:

Interface gráfica do usuário, Aplicativo, Word

Descrição gerada automaticamente

No exemplo, temos um script JavaScript embutido em uma página HTML. No script, temos o método alert() tendo a operação de adição 5 + 6 como parâmetro, então haverá a caixa de alerta mostrando a mensagem 11 (resultado da operação).

Exemplo 2:

<!DOCTYPE html>

<html>

<body>

<h2>Método alert()</h2>

<button onclick=”alertar()”>alertar</button>

<script>

function alertar() {

alert(“Mensagem ao usuário!”);

}

</script>

</body>

</html>

Resultado antes de clicar no botão OK:

Uma imagem contendo Texto

Descrição gerada automaticamente

Resultado depois de clicar no botão OK:

Interface gráfica do usuário, Texto, Aplicativo

Descrição gerada automaticamente

No exemplo, temos um script JavaScript embutido em uma página HTML. No script, há uma função chamada alertar(). Na função, temos o método alert(). Para esse método, é passado o seguinte parâmetro: “Mensagem ao usuário!” (para a mensagem da caixa de alerta).

Na página, há um elemento <button>, com o texto “OK”. No atributo onclick desse elemento, há a menção à função alertar(), ou seja, ao clicar no botão, a função será chamada e abrirá a caixa de alerta.

Apesar de sua utilidade, o alert() tem limitações significativas. A mais notável é a sua natureza bloqueadora: enquanto a caixa de alerta está aberta, o resto da página não pode ser interagido. Além disso, a aparência do alert() não pode ser personalizada, o que pode ser um obstáculo para manter a consistência do design do site.

Uma aplicação comum do alert() é em mensagens de aviso. Por exemplo, pode-se usá-lo para informar ao usuário que ele deixou um campo obrigatório de um formulário em branco.

O alert() também pode ser usado para fins de debugging durante o desenvolvimento. Por exemplo, exibir o valor de uma variável para entender o fluxo do programa ou identificar bugs.

Existem alternativas modernas ao alert(), como caixas de diálogo customizadas usando HTML, CSS e JavaScript. Estas oferecem maior flexibilidade em design e comportamento, sem bloquear a interface do usuário.

O uso do alert() pode ter um impacto significativo na experiência do usuário. Caixas de diálogo inesperadas podem ser intrusivas e prejudicar a usabilidade, especialmente se usadas em excesso ou para informações não críticas.

É importante seguir boas práticas ao usar alert(). Por exemplo, deve-se evitar usar alert() para informações que não requerem atenção imediata do usuário ou para processos que podem ser concluídos sem interrupção.

O método alert() é uma ferramenta fundamental em JavaScript, mas deve ser usado com consideração. Seu impacto na experiência do usuário e as limitações de personalização tornam essencial considerar alternativas mais flexíveis e menos intrusivas.

Espero que tenham gostado! 

Forte abraço e até a próxima jornada!

_________________________

Professor Rogerão Araújo

Quer ficar por dentro dos concursos públicos abertos e previstos pelo Brasil?
clique nos links abaixo:

Concursos Abertos

Concursos 2024

Receba gratuitamente no seu celular as principais notícias do mundo dos concursos!
clique no link abaixo e inscreva-se gratuitamente:

Telegram

Deixe seu like:

Avatar


Auditor Federal do STN, especialista em Governança em TI e professor de Desenvolvimento de Sistemas