Depuração de JavaScript
Erros podem (vai) acontecer, toda vez que você escreve algum novo código de computador.
Depuração de código
O código de programação pode conter erros de sintaxe ou erros lógicos.
Muitos desses erros são difíceis de diagnosticar.
Muitas vezes, quando o código de programação contém erros, nada acontece. Não há mensagens de erro e você não receberá indicações de onde procurar por erros.
Procurar (e corrigir) erros no código de programação é chamado de depuração de código.
Depuradores JavaScript
A depuração não é fácil. Mas, felizmente, todos os navegadores modernos têm um depurador JavaScript embutido.
Os depuradores integrados podem ser ativados e desativados, forçando os erros a serem relatados ao usuário.
Com um depurador, você também pode definir pontos de interrupção (locais onde a execução do código pode ser interrompida) e examinar variáveis enquanto o código está sendo executado.
Normalmente, caso contrário, siga as etapas na parte inferior desta página, você ativa a depuração em seu navegador com a tecla F12 e seleciona "Console" no menu do depurador.
O método console.log()
Se o seu navegador suporta depuração, você pode usar console.log()
para exibir valores JavaScript na janela do depurador:
Exemplo
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
Dica: leia mais sobre o console.log()
método em nosso JavaScript Console Reference .
Definir pontos de interrupção
Na janela do depurador, você pode definir pontos de interrupção no código JavaScript.
Em cada ponto de interrupção, o JavaScript interromperá a execução e permitirá que você examine os valores do JavaScript.
Depois de examinar os valores, você pode retomar a execução do código (normalmente com um botão de reprodução).
A palavra-chave do depurador
A palavra- debugger
chave interrompe a execução do JavaScript e chama (se disponível) a função de depuração.
Isso tem a mesma função que definir um ponto de interrupção no depurador.
Se nenhuma depuração estiver disponível, a instrução do depurador não terá efeito.
Com o depurador ativado, esse código parará de ser executado antes de executar a terceira linha.
Exemplo
let x = 15 * 5;
debugger;
document.getElementById("demo").innerHTML = x;
Ferramentas de depuração dos principais navegadores
Normalmente, você ativa a depuração em seu navegador com F12 e seleciona "Console" no menu do depurador.
Caso contrário, siga estes passos:
cromada
- Abra o navegador.
- No menu, selecione "Mais ferramentas".
- Em ferramentas, escolha "Ferramentas do desenvolvedor".
- Por fim, selecione Console.
Raposa de fogo
- Abra o navegador.
- No menu, selecione "Desenvolvedor Web".
- Por fim, selecione "Console da Web".
Beira
- Abra o navegador.
- No menu, selecione "Ferramentas do desenvolvedor".
- Por fim, selecione "Console".
Ópera
- Abra o navegador.
- No menu, selecione "Desenvolvedor".
- Em "Desenvolvedor", selecione "Ferramentas do desenvolvedor".
- Por fim, selecione "Console".
Safári
- Vá para Safari, Preferências, Avançado no menu principal.
- Marque "Ativar o menu Mostrar desenvolvimento na barra de menus".
- Quando a nova opção "Desenvolver" aparecer no menu:
Escolha "Mostrar console de erro".
Você sabia?
Depuração é o processo de testar, encontrar e reduzir bugs (erros) em programas de computador.
O primeiro bug de computador conhecido foi um bug real (um inseto) preso na eletrônica.