Depuração do JavaScript

Erros sempre acontecem, sempre que você escreve algum novo código de computador.

Depuração do JavaScript

Escrever JavaScript sem depurador é difícil.

Seu código pode conter erros de sintaxe ou lógicos, que são difíceis de diagnosticar.

Normalmente, se o código JavaScript contiver erros, nada acontece. Não há mensagens de erro e nenhuma indicação de onde procurar erros.

Normalmente, sempre que você tenta escrever novo código JavaScript, podem ocorrer erros.

Depurador JavaScript

Encontrar erros em código de programação é chamado de depuração de código.

A depuração não é simples. Mas felizmente, todos os navegadores modernos têm depuradores integrados.

O depurador integrado pode ser aberto ou fechado, forçando relatórios de erros para o usuário.

Com o depurador, você também pode definir breakpoints (local onde a execução do código é interrompida) e verificar variáveis durante a execução do código.

Normalmente, você pode iniciar o depurador no navegador usando a tecla F12 e, em seguida, escolher "Console" no menu do depurador.

método console.log()

Se seu navegador suportar depuração, você pode usar console.log() Exibir valores do JavaScript no depurador:

Exemplo

<!DOCTYPE html>
<html>
<body>
<h1>Minha Primeira Página da Web</h1>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>

Experimente pessoalmente

Dica:Acesse nosso manual de referência do Console JavaScript para obter mais informações sobre o método console.log().

Definir breakpoints

No depurador, você pode definir breakpoints no código JavaScript.

Em cada breakpoint, o JavaScript será pausado para que você possa verificar os valores do JavaScript.

Depois de verificar os valores, você pode continuar a execução do código.

Palavra-chave debugger

debugger A palavra-chave interrompe a execução do JavaScript e chama (se houver) a função de depuração.

Isso é semelhante à função de definir breakpoints no depurador.

Se o depurador não estiver disponível:debugger A instrução não tem efeito.

Se o depurador estiver aberto, este código será pausado antes de executar a terceira linha.

Exemplo

var x = 15 * 5;
debugger;
document.getElementById("demo").innerHTML = x;

Experimente pessoalmente

Ferramentas de depuração de navegadores populares

Normalmente, você ativa a depuração pressionando a tecla F12 no navegador e escolhe 'Console' no menu do depurador.

Caso contrário, siga os seguintes passos:

Chrome

  • Abra o navegador
  • Selecione Ferramentas no Menu
  • Selecione Ferramentas de Desenvolvedor nas Ferramentas
  • Por fim, selecione o Console

Firebug Firefox

  • Abra o navegador
  • Acesse o site: http://www.getfirebug.com
  • Segundo as seguintes instruções: Como instalar o Firebug

Internet Explorer

  • Abra o navegador
  • Selecione Ferramentas no Menu
  • Selecione Ferramentas de Desenvolvedor nas Ferramentas
  • Por fim, selecione o Console

Opera

  • Abra o navegador
  • Acesse o site: http://dev.opera.com
  • Segundo as seguintes instruções: Como instalar o Firebug Lite

Menu de Desenvolvimento Safari

  • Clique em Menu Safari, Preferências, Avançado
  • Marque 'Ativar Menu de Desenvolvimento na Barra de Menu'
  • Quando aparecer uma nova opção 'Desenvolvimento' no menu, selecione 'Mostrar Console de Erros'

Você sabia?

Depuração é o processo de teste, encontrar e reduzir bugs (erros) em programas de computador.

O primeiro bug conhecido em computadores foi um inseto real preso em um dispositivo eletrônico (um inseto).