⚡ JavaScript

Instalação e Primeiro Programa Hello World — JavaScript

O que é e para que serve?

Imagine que você está dando comandos a um robô. Você diz: "Robô, acenda a luz", e ele acende. Mas para que o robô entenda, você precisa falar em uma linguagem especial. Da mesma forma acontece com o computador: para que ele faça alguma coisa, você precisa dar um comando em uma linguagem de programação.

JavaScript (abreviado como JS) é uma dessas linguagens. Ele é muito popular porque permite "dar vida" às páginas da web. Quando você entra em um site e vê uma imagem que aumenta ao passar o mouse, ou um menu que desliza, ou janelas pop-up que aparecem — provavelmente, isso foi feito com JavaScript.

Vamos fazer uma analogia. Imagine que você é um professor de educação física. Você diz aos alunos: "Turma, levantem-se!", "Levantem a mão direita!", "Dêem um passo à frente!". Se você disser "Levantem-se" em chinês, ninguém vai entender. É preciso uma linguagem compreensível. JavaScript é exatamente essa linguagem compreensível para o navegador (o programa através do qual você vê os sites, como Chrome, Firefox, Safari).

Por que aprender JavaScript?

  • Ele está em toda parte: quase todo site usa JavaScript.
  • Ele é visual: você vê o resultado das suas ações imediatamente.
  • Ele é simples para começar: para escrever seu primeiro programa, você não precisa instalar programas complicados — um bloco de notas comum e um navegador são suficientes.
  • Ele é requisitado: programadores que sabem JavaScript são muito necessários para as empresas.

Neste artigo, vamos aprender a instalar as "ferramentas" para trabalhar com JavaScript e escrever nosso primeiro programa — "Hello, World!". É uma tradição de todos os programadores: o primeiro programa sempre exibe esta saudação. Considere isso como o "primeiro passo" no mundo da programação.

Se você já conhece Python: Em Python, você escrevia print("Hello, World!"). Em JavaScript, será um pouco diferente, mas o sentido é o mesmo — mostrar um texto na tela.


Exemplos de código com explicação

Antes de escrever código, vamos preparar o "local de trabalho". Você vai precisar de duas coisas:

  1. Um navegador (Chrome, Firefox, Edge, Safari — qualquer um serve).
  2. Um editor de texto — o programa onde você escreverá o código. A opção mais simples é o "Bloco de Notas" (Windows) ou "TextEdit" (Mac) no modo de texto simples. Mas é melhor baixar um editor especial, como o VS Code (Visual Studio Code) — ele é gratuito e muito prático.

Como verificar se tudo está funcionando? Existem duas maneiras de executar JavaScript:

  • Diretamente no navegador (console): Pressione F12 (ou Ctrl+Shift+I) no teclado, abra a aba "Console" e escreva o código lá. É rápido, mas não é prático para programas grandes.
  • Através de um arquivo HTML: Vamos criar um arquivo com a extensão .html, dentro do qual estará nosso código JavaScript. Esta é a maneira correta.

Vamos começar com a segunda maneira. Crie uma nova pasta no computador, nomeie-a, por exemplo, "aulas_JS". Dentro dela, crie um arquivo com o nome index.html (é importante que a extensão seja .html, e não .txt). Abra este arquivo no editor de texto.

Insira nele o seguinte modelo básico:




    
    Meu primeiro programa



    

    











Agora salve o arquivo e abra-o no navegador (apenas dê um duplo clique nele). Você verá uma página vazia. Ainda não aconteceu nada, porque não escrevemos o código. Vamos corrigir isso!


Exemplo 1: O clássico "Hello, World!"

A maneira mais simples de mostrar um texto é usar o comando alert(). Ele exibe uma janela pop-up com uma mensagem. Insira o seguinte código entre as tags <script> e </script>:

// Isto é um comentário. O computador o ignora.
// Ele serve para explicar o código para as pessoas.

// alert() é uma função embutida (como um comando).
// Ela mostra uma janela com uma mensagem.
alert('Hello, World!'); // O texto que queremos mostrar, escrevemos entre aspas.

O que vai acontecer? Quando você abrir (ou atualizar) a página, aparecerá uma janela com o texto "Hello, World!". Para fechá-la, você precisa clicar em "OK".

Análise:

  • alert — é o nome do comando. Ele diz ao navegador: "Mostre uma janela".
  • Parênteses () — dentro deles, passamos o que queremos dizer. Neste caso, o texto.
  • Aspas simples ' ' — são necessárias para que o computador entenda que é exatamente um texto, e não um comando. Também podemos usar aspas duplas " ".
  • Ponto e vírgula ; — é como um ponto final em uma frase. Ele diz: "O comando terminou". Deve ser colocado após cada comando.

Comparação com Python: Em Python, você escreveria print("Hello, World!"). A diferença é que print exibe o texto no console, enquanto alert exibe em uma janela pop-up.


Exemplo 2: Exibição no console do desenvolvedor

Janelas pop-up não são muito práticas se você precisa exibir muitas informações. Os programadores usam com mais frequência o console — um local especial para depuração. Para exibir texto lá, usa-se o comando console.log().

Substitua o código anterior dentro de <script> por este:

// console é um objeto (uma estrutura complexa) que gerencia o console.
// .log() é um método (uma ação) que registra uma mensagem no console.

console.log('Esta é uma mensagem no console!');
console.log('Podemos exibir um número:', 42);
console.log('Podemos exibir não