Primeiro Programa em JavaScript

Vamos criar o primeiro programa em JavaScript. Para escrever e testar programas em JavaScript, precisaremos de duas coisas: um editor de texto e um navegador da web.

Você pode escolher qualquer editor de texto que preferir - Atom, Sublime Text, Visual Studio Code, Notepad++ e outros. Neste guia, irei me basear no Visual Studio Code, um editor de texto gratuito e multifuncional, pois é o mais popular.

Quanto ao navegador, você pode usar as versões mais recentes de qualquer navegador da web preferido. Neste guia, irei me concentrar principalmente no Google Chrome.

Para começar, vamos definir um diretório para nossa aplicação. Por exemplo, vamos criar uma pasta chamada app no disco C. Dentro dessa pasta, criaremos um arquivo chamado index.html. Este arquivo representará a página da web com o código HTML.

Vamos abrir este arquivo em um editor de texto e identificar o seguinte código no arquivo:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Programício</title>
  </head>
  <body>
    <script>
      document.write("<h2>Primeiro programa em JavaScript</h2>");
    </script>
  </body>
</html>

Aqui nós definimos os elementos HTML padrão. No elemento head, é definida a codificação utf-8 e o título (elemento title). No elemento body, é definido o corpo da página da web, que neste caso consiste apenas em um elemento <script>.

A inclusão de código JavaScript em uma página HTML é feita com a tag <script>. Esta tag deve ser colocada ou no cabeçalho (entre as tags <head> e </head>), ou no corpo da página da web (entre as tags <body> e </body>). Frequentemente, os scripts são incluídos antes da tag de fechamento </body> para otimizar o carregamento da página da web.

Anteriormente, era necessário especificar o tipo de script na tag <script>, pois essa tag pode ser usada não apenas para incluir instruções JavaScript, mas também para outros fins. Assim, mesmo agora, você pode encontrar em algumas páginas da web uma definição de elemento script como esta:

<script type="text/javascript">

Atualmente, é preferível omitir o atributo type, pois os navegadores assumem por padrão que o elemento script contém instruções JavaScript.

O código JavaScript que estamos usando contém uma única expressão:

document.write("<h2>Primeiro programa em JavaScript</h2>");

O código JavaScript pode conter várias instruções e cada instrução termina com um ponto e vírgula. Nossa instrução chama o método document.write(), que exibe algum conteúdo na página da web, neste caso o título é <h2>Primeiro programa em JavaScript</h2>.

A aparência do arquivo no editor de texto Visual Studio Code:

Primeiro script em JavaScript em Visual Studio Code

Agora que a página da web está pronta, abra-a no navegador da web: