Desenvolvimento

Teste 0 - Coisinhas Básicas sobre o JavaScript

Comentários em JavaScript:

// Comentário de apenas uma linha
/* Comentário que ocupa uma linha, mas poderia ocupar mais linhas */
/*
Comentário que ocupa várias linhas.
Comentário que ocupa várias linhas.
*/

Quebrar linhas extensas:

O JavaScript permite-nos interromper a escrita de strings e continuar a escrever na linha seguinte, usando o caracter "\", como mostrado abaixo:

var s = 'Mein Name ist "Entsetzen". Ich bleibe zu Hause \
und mache nichts. Immer beklagt sich meine Mutter um ihren \
doofen Sohn. Was soll ich denn tun?'

Declaração de Variáveis:

As variáveis declaradas sem a função var são variáveis globais.
As variáveis declaradas usando a função var existem apenas no contexto em que foram definidas.
A linguagem JavaScript reconhece três tipos de variáveis: números, texto (string) e booleano (true/false). null é especialmente usado para indicar que a variável está vazia.

A linguagem JavaScript possui um operador que permite escolher o valor a atribuir a uma variável, conforme o resultado do teste condicional:

variável = (condição) ? valor1 : valor2

Este operador funciona do seguinte modo: se a condição for verdadeira, a variável passará a ter o valor1; se a condição não for satisfeita será atribuído à variável o valor2.

Caracteres especiais em expressões de texto:

\b - backspace
\f - form feed
\n - new line
\r - carriage return
\t - tab
\\ - backlash (o próprio caracter "\")

Para colocar aspas duplas ou simples dentro de uma expressão de texto, estas devem ser precedidas do caracter \, a não ser que as aspas duplas sejam o container do texto, e dentro sejam usadas aspas simples (ou vice-versa).

Matrizes:

Os componentes de um objeto array, no JavaScript, podem ser definidos dentro da declaração da matriz ou declarados depois, referenciando-se seus índices, como mostrado abaixo:

var worten = new Array("Scheisse", "Mist", "Arschloch")
var nummern = new Array(3)
nummern[0] = "Eins"
nummern[1] = "Zwei"
nummern[2] = "Drei"

Se um índice mais alto for atribuído a um elemento da matriz, o JavaScript automaticamente amplia a matriz. O array é um objeto, e possui propriedades como length, que retorna o número de elementos da matriz. Exemplo:

var numeroDeElementos = worten.length

Operadores:

Operadores aritméticos básicos:

x+=y       // Significado: x=x+y
x-=y       // Significado: x=x-y
x*=y       // Significado: x=x*y
x/=y       // Significado: x=x/y
x%=y       // Significado: x=x%y (o resto da divisão x/y)
variable++ // Recurso especial para adicionar uma unidade à variável 'variable'
variable-- // Recurso especial para subtrair uma unidade da variável 'variable'

Operadores de comparação:

== // Igualdade
!= // Desigualdade
> // Maior que
>= // Maior ou igual a
< // Menor que
<= // Menor ou igual a

Operadores lógicos:

b && c // operador AND
b || c // operador OR
!b // operador NOT

Como inserir um arquivo JavaScript externo:

Basta incluir o trecho abaixo, em qualquer parte do código HTML, para referenciar um arquivo externo que tenha um código JavaScript. O arquivo externo contém APENAS o código JavaScript. Atenção para a extensão do arquivo (.js):

Utilizando caracteres especiais do HTML num script:

A linguagem (x)HTML trata alguns caracteres de forma especial. Entre eles temos: &, < e >. Estes caracteres são utilizados na linguagem JavaScript para formar operadores lógicos. Se os usarmos num script (o que é inevitável, porque eles são indispensáveis) as nossas páginas já não serão capazes de passar num teste de validação de HTML ou de XHTML, e até podem ser interpretadas incorretamente por alguns browsers.
Para evitarmos que isso aconteça devemos fazer o seguinte: sempre que dentro de um script colocarmos um dos caracteres &, < ou > devemos colocar todo o código do script dentro de um comentário do HTML. Isto serve para evitar que o browser tente interpretar o conteúdo do script como se fosse (x)HTML, o que seria errado. Por seu lado, um validador de HTML ou de XHTML que vá analisar a página fica sabendo que o script não deve ser validado porque está escrito numa linguagem diferente.

Exemplo:

Estrutura "if" em JavaScript

if (condição)
{
código a ser executado se a condição for verdadeira
}
else
{
código a ser executado se a condição for falsa
}

Observa-se que aqui não é necessário nenhuma forma de "Endif" para fechar a estrutura if, como em outras linguagens de programação.

Estrutura "for" em JavaScript

for (inicialização; condição; atualização)
{
bloco de código a ser executado
}

O primeiro argumento (inicialização) é composto por uma ou mais instruções (separadas por vírgulas). Essas instruções são executadas antes de se iniciar o ciclo.
O segundo argumento (condição) é composto por uma ou mais condições (separadas por vírgulas) que são testadas antes de se executar o bloco de código associado ao ciclo. Se uma dessas condições não for verdadeira o ciclo termina.
O terceiro argumento (atualização) é composto por uma ou mais instruções (separadas por vírgulas) que são executadas sempre que se completa uma execução do bloco de código associado ao ciclo. Normalmente essas instruções são usadas para incrementar uma variável que funciona como contador, mas podem ser usadas para outros fins.

Exemplo:

for (var i = 1; i <= 3; ++i)
alert(i)

Neste exemplo a inicialização é var i = 1, a condição é i <= 3 e a atualização é ++i. O ciclo funciona do seguinte modo:

1. Declara-se uma variável i e dá-se-lhe o valor 1 (um).
2. Verifica-se a condição i <= 3. Se for verdadeira salta-se para o passo seguinte, mas se for falsa pára-se a execução do ciclo.
3. Executa-se o bloco de código associado ao ciclo for (mostrar uma caixa de alerta).
4. Executa-se a parte ++i, que aumenta em uma unidade o valor da variável i.
5. Saltar para o passo 2 (teste da condição).

Estruturas "while" e "do... while" em JavaScript

Sintaxe da estrutura while:

while (condição)
{
código a ser executado
}

Sintaxe da estrutura do... while:

do
{ código a ser executado
}
while (condição)

Exemplo de Declaração e Uso de Variáveis em JavaScript

A tabelinha abaixo mostra as dimensões da tela do usuário que está visualizando a página neste momento:

Variável screen.height
Variável screen.width
Variável screen.availHeight
Variável screen.availWidth

O código é composto de uma declaração de variáveis JavaScript dentro da tag <head> e de comandos JavaScript apropriados dentro das células da segunda coluna da tabela, como mostrado abaixo:

<head>
   <script type='text/javascript'>
      var screenHeight = screen.height
      var screenWidth = screen.width
      var liveScreenHeight = screen.availHeight
      var liveScreenWidth = screen.availWidth
   </script>
</head>
<body>
   
   document.writeln('A altura total desta tela é ' + screenHeight + 'px.')
   document.writeln('A largura total desta tela é ' + screenWidth + 'px.')
   document.writeln('A altura ativa desta tela é ' + liveScreenHeight + 'px.')
   document.writeln('A largura ativa desta tela é ' + liveScreenWidth + 'px.')
</body>

As 4 variáveis são declaradas na seção <head>, e usadas posteriormente dentro do corpo do documento (apropriadamente inseridas dentro de tags <script>, claro). O comando JavaScript que aparece aqui é o writeln, usado para escrever mensagens na tela. Atenção para a concatenação de texto e variáveis em JavaScript, feita utilizando aspas simples e o sinal +.