Um programa de computador é uma sequência de instruções a serem executadas por um computador.

Os elementos-html que compõe a apresentação visual do aplicativo-html podem ser manipulados pelo programa javascript.

Um programa javascript é uma lista de instruções de programação vinculada à página-html carregada pelo navegador, sendo inserido diretamente no script-html ou carregando arquivos contendo as instruções.

Os programas javascript executados nas páginas-html são interpretadas e executadas pelo próprio navegador da web responsável pelo carregamento da página.

Instruções do JavaScript

As instruções JavaScript são compostas por:

  • Palavras-chave.
  • Identificadores.
  • Expressões.
  • Comentários.

A declaração a seguir comanda ao navegador escrever "Olá Mundo!", dentro do objeto Html com id = "demo".

document.getElementById("demo").innerHTML = "Olá Mundo!";

Os programas e instruções são frequentemente chamados de código. As instruções são executadas, uma a uma, na mesma ordem em que são declaradas. A maioria dos programas JavaScript incluem muitas instruções para realização das tarefas desejadas.

Ponto e Vírgula ;

O ponto e vírgula ; separa as instruções do programa. Adicione o ponto e vírgula no final de cada instrução executável para a separar da próxima.

var a, b, c;     // Declara 3 variáveis
a = 5;           // Atribui o valor 5 para 'a'
b = 6;           // Atribui o valor 6 para 'b'
c = a + b;       // Atribui o valor da soma de 'a' e 'b' para 'c'

Quando separadas por ponto e vírgula, são permitidas várias instruções em uma linha.

a = 5; b = 6; c = a + b;

Na web, você pode ver exemplos sem ponto e vírgula, separadas por quebra de linha no texto, mas esta é uma separação de instruções muito sutil. Finalizar as instruções com ponto e vírgula não é obrigatório, mas é algo bastante recomendado.

Espaço em Branco

JavaScript ignora vários espaços. Você pode adicionar espaço em branco ao seu script para torná-lo mais legível.

As seguintes linhas são equivalentes:

var pessoa = "Hege";
var pessoa =    "Hege";

Uma boa prática é colocar espaços ao redor dos operadores (= + - * /):

var x = y + z;

Comprimento e Quebra de Linha

Para melhor legibilidade geralmente o código fica com até 80 caracteres no máximo.

Não cabendo em uma única linha uma instrução pode ser quebrada, geralmente após um operador.

document.getElementById("demo").innerHTML = "Hello Dolly!";

As instruções JavaScript podem ser agrupadas em blocos de código, dentro de colchetes {...}.

Blocos de Código

O objetivo dos blocos de código é agrupar instruções para serem executadas em conjunto, do início ao fim do bloco.

Por exemplos utilizamos blocos de código no corpo das funções do JavaScript.

function minhaFuncao() {
   document.getElementById("demo1").innerHTML = "Olá Mundo!";
   document.getElementById("demo2").innerHTML = "Como está?";
}

Futuramente aprofundaremos sobre funções.

Neste tutorial são usados 3 espaços de recuo para blocos de código.

Palavras-Chave

As instruções geralmente começam com uma palavra-chave para identificar a ação a ser executada.

Visite a referência de palavras reservadas para ver uma lista completa de palavras-chave JavaScript.

A seguir são relacionadas palavras-chave do JavaScript utilizadas neste tutorial.

  • pause: Encerra um comutador ou um loop
  • continue: Salta de um loop e começa no topo
  • depurador: Interrompe a execução do JavaScript e chama (se disponível) a função de depuração
  • do while: Executa um bloco de instruções e repete o bloco, enquanto uma condição é verdadeira
  • for: Marca um bloco de instruções a serem executadas, desde que uma condição seja verdadeira
  • function: Declara uma função
  • if... else: Marca um bloco de instruções a serem executadas, dependendo de uma condição
  • return: Sai de uma função
  • interrupt: Marca um bloco de instruções a serem executadas, dependendo dos diferentes casos
  • try... catch: Implementa o tratamento de erros em um bloco de instruções
  • var: Declara uma variável

Palavras-chave JavaScript são palavras reservadas. Palavras reservadas não podem ser usadas como nomes para variáveis.

Identificadores

Identificadores são nomes associados às variáveis, objetos e funções declarados em um programa.

Os identificadores são utilizados na atribuição de valores a variáveis.

var x = 123;         // o identificador x se refere ao valor inteiro 123
var y = 456.78       // o identificador y se refere ao valor real 456.78
var z = "javascript" // o identificador z se refere ao valor string "javascript"
var k = true;        // o identificador k se refere ao valor lógico true

Os identificadores são utilizados na declaração de funções.

function somar(a,b) { // o identificador somar se refere à função que soma dois valores
   return a+b;
}

function concatenar(a,b) { // o identificador concaternar se refere à função 
   a + " " + b;            // que junta dois valores separados por branco
}

Os identificadores são utilizados na declaração das propriedades e métodos de objetos. As variáveis de um objeto são referidos como propriedades. As funções  de um objetv são referidos como métodos.

var carro = {             // carro: identificador de variável
   marca: "fiat",         // marca: identificador de propriedade
   modelo: "uno",         // modelo: identificador de propriedade
   ano: 2000,             // ano: identificador de propriedade
   numPortas: 2,          // numPortas: identificador de propriedade
   ligar: function() {    // identificador de método
      // instruções do método
   }
   acelerar: function() { // identificador de método
      // instruções do método
   }

Expressões

Temos diferentes tipos de expressões: aritméticas, lógicas, caractér.

2 + 2          // operação aritmética de soma
6 - 3          // operação aritmética de subtração
6 * 3          // operação aritmética de multiplicação
10 / 3         // operação aritmética de divisão
false || false // operação lógica ou
true  || false // operação lógica ou
true  && false // operação lógica e
true  && true  // operação lógica e

Comentários

Comentários são partes do código que não são interpretados pelo navegador.

// comentário de linha
/*
comentário de bloco
*/