Erros em JavaScript – Como usar o Console (Tutorial de JavaScript)

Neste tutorial de nosso Curso de JavaScript, vamos aprender o que é o Console do JS, para que serve, em quê nos vai ser útil e vamos falar sobre os erros e problemas que iremos lidar durante nossas vidas de desenvolvedor web.

Erros em programação JavaScript

Não importa o quanto você vá estudar, se já gosta de exatas (sim, Matemática ajuda, e muito, no ramo da computação) ou se já programou em outras linguagens de programação: você irá cometer muitos, muitos erro durante toda sua carreira de programador JavaScript.
Mas não se assuste, é normal. Não é uma coisa simples e fácil, programação JavaScript exige muito estudo e empenho mesmo, e errar vai fazer parte. As vezes iremos passar horas caçando os erros, tentando ver onde erramos, o motivo de nosso aplicativo não estar funcionando da maneira que queríamos, porque algo saiu diferente do esperado e o pior: porque, raios, nosso programa nem sequer roda.
Se você já programou uma linguagem de programação compilada, como C, C++ ou Java, sabe que ao tentar compilar um programa (transformar o seu código em um arquivo executável) e ele tiver algum erro, ele não vai compilar, vai dar erro e mostrar o erro que ocorreu.
Isso não acontece no JavaScript, e em linguagens de script de um modo geral. Não há esse rigor, o que pode ser bom muitas vezes.
Mas geralmente é uma baita dor de cabeça. E o pior, você roda seu script JS e caso der algum erro, pode ser que não aconteça simplesmente nada.
Agora imagine que você fez um sistema com JavaScript enorme, com centenas ou milhares de linhas, com vários arquivos .js, muitas funções, coisas complexas e tal, foi rodar e nada. Sim, nada apareceu.
Pois bem, vamos apresentar uma ferramenta que será uma grande amiga e companheira sua, caso realmente leve a sério seus estudos em JavaScript, que é o console de erros.

Abrindo o Console de Comando

Uma das características mais importantes dos programadores é a capacidade de fuçar e descobrir as coisas sozinhos. Se quer treinar esse instinto e habilidade, agora é uma boa hora.

Fuce no seu navegador web e encontre o “Console JavaScript”, mexa nos menus, ferramentas, opções, não desista, tente achar.
Caso não consiga ou não tenha paciência (aconselhamos a tentar mais), vamos dizer como abrir o console nos principais navegadores atualmente existentes e usados.

Tutorial de JavaScript - Curso online completo - Console do JS

No Google Chrome, ache o ícone de menu, vá em Ferramentas e depois em “Console JavaScript”, ou simplesmente aperte “Control + Shift + J”, e verá a imagem acima.

Agora, lá no console (local onde você vai dar comandos), digite:
1+1 e dê enter. Veja o que acontece.

Agora digite:
'Java' + 'Script', o que acontece? Diga nos comentários

Depois digite:
clear()

O que aconteceu no sole de comandos de JavaScript?

Encontrando erros no JavaScript

Digite o seguinte código em sua página HTML:


<!DOCTYPE html>
<html>
 <head>
   <title>Curso JavaScript Progressivo</title>

   <script type="text/javascript">
    document.write("Curso JavaScript Progressivo);
   </script>

 </head>
</html>

Ela contém um script que deveria exibir uma mensagem no documento:
"Curso JavaScriptProgressivo"


Porém, ele contém um erro: tem as duplas no começo e não tem no final.
Quando abrir o site, vai ver que nada vai aparecer.

Agora, abra o console do JS.
Aqui no Chrome aparece a seguinte mensagem de erro:
Curso de JavaScript online grátis

Veja que aparece: home.html:7

Isso quer dizer o seguinte: o erro está na linha 7 do documento home.html (nome que salvei meu site).

Se colocar as aspas duplas ao final:
document.write("Curso JavaScript Progressivo");

E rodar novamente o documento, vai ver que esse erro some do console.
Prontinho, você aprendeu a detectar e corrigir um problema em JavaScript.

O console mostra até a linha que ocorre o erro.
Isso vai ser muuuito importante em nossas vidas de programadores!

Nenhum comentário:

Postar um comentário