Buscar

Manual javascript


Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 3, do total de 16 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 6, do total de 16 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes
Você viu 9, do total de 16 páginas

Faça como milhares de estudantes: teste grátis o Passei Direto

Esse e outros conteúdos desbloqueados

16 milhões de materiais de várias disciplinas

Impressão de materiais

Agora você pode testar o

Passei Direto grátis

Você também pode ser Premium ajudando estudantes

Continue navegando


Prévia do material em texto

Manual JavaScript
“A Versão Nova de uma Velha História”“A Versão Nova de uma Velha História”
Este manual foi escrito lançado pela última vez no início 2004 e tenta explicar JavaScript 
enquanto linguagem de programação.
Fez parte da Enciclopédia Omega e, com o fato de a Enciclopédia Omega estar parada e, 
acrescida a isso a instabilidade na ferramenta então utilizada pela EO, resolvi desvincular 
este manual da EO e lançá-lo em separado. Aproveito para acrescentar um padrão de 
codificação que eu havia criado há tempos também, e que até hoje se encontrava esquecido.
A partir desta versão, este manual se encontrará em meu site pessoal, podendo evoluir para 
tratar de AJAX, XUL e outros assuntos, a depender da sua aceitação e do meu tempo 
disponível.
Espero que apreciem.
-- Cárlisson Galdino
"Não sou nem ateniense, nem grego, mas sim um 
cidadão do mundo." Sócrates
Manual JavaScript
Versão atual: 2006.04
Data de Publicação: 21 de abril de 2006
Classificação: Manual de Programação
Autor: Cárlisson Galdino
Contato: bardo@swissinfo.org
 #2
Manual JavaScript
ÍndiceÍndice
Introdução......................................................................................................................................................5
História............................................................................................................................................................................5
Altos e Baixos.................................................................................................................................................................5
O Que Ela É....................................................................................................................................................................5
Sobre Este Manual..........................................................................................................................................................5
Conhecimento Prévio......................................................................................................................................................6
Software Necessário........................................................................................................................................................6
Programando Estruturadamente.....................................................................................................................7
Tipos de Variáveis...........................................................................................................................................................7
Operadores......................................................................................................................................................................7
Listas...............................................................................................................................................................................8
Estrutura Básica...............................................................................................................................................................8
Estruturas de Repetição...................................................................................................................................................8
while.....................................................................................................................................................................................8
do-while................................................................................................................................................................................9
for..........................................................................................................................................................................................9
Estruturas de Decisão......................................................................................................................................................9
if............................................................................................................................................................................................9
switch..................................................................................................................................................................................10
if condensado......................................................................................................................................................................10
Modularização...............................................................................................................................................................10
Sobre Parâmetros...........................................................................................................................................................11
Programando com Orientação a Objetos......................................................................................................12
Antes de Começar.........................................................................................................................................................12
Orientação a Objetos.....................................................................................................................................................12
Composição........................................................................................................................................................................12
Classes................................................................................................................................................................................12
Herança...............................................................................................................................................................................12
Usando Objetos.............................................................................................................................................................12
Estrutura with................................................................................................................................................................13
A Criação de Classes.....................................................................................................................................................13
Classe Data....................................................................................................................................................................13
Composição...................................................................................................................................................................14
Herança.........................................................................................................................................................................14
Iara JavaScript Code Standards....................................................................................................................15
Indentação.....................................................................................................................................................................15
Expressões.....................................................................................................................................................................15
 #3
Manual JavaScript
Comentários..................................................................................................................................................................15
Nomenclatura................................................................................................................................................................16Variáveis........................................................................................................................................................................16
Classes...........................................................................................................................................................................16
 #4
Manual JavaScript
IntroduçãoIntrodução
História
No ano de 1994, a empresa Netscape, fabricante do programa 
de mesmo nome para navegação na Internet, sentiu necessidade de 
implementar uma tecnologia de processamento modo cliente. Para 
programas simples que fossem executados no computador do usuário 
mesmo, sem que fosse preciso enviar informações para o computador 
servidor.
Eram coisas como a validação de um formulário, por exemplo. 
Na mesma época era adicionado suporte a applets Java (aplicativos 
pequenos e que são executados embutidos, no nosso caso em páginas 
HTML. Possuem uma área formalmente delimitada para eles) ao 
navegador, mas... Em se tratando de programas complexos ou visuais 
era ótimo, só que o tempo necessário para copiar e executar o 
programa em bytecode simplesmente não compensava certas 
pequenas tarefas. Além de que os applets não estão tão ligados assim 
aos elementos da página HTML afinal de contas. Foi aí que nasceu a 
solução.
A Netscape criou LiveScript, uma linguagem embutível na 
página HTML, interpretada pelo navegador, tomando bem menos 
tempo que Java e estando mais unida aos elementos da página.
Assim como aconteceu com Java - que se chamava Oak -, a 
linguagem da Netscape terminou mudando de nome com a 
paritipação da Sun Microsystems no projeto e assim a versão Beta 2 
do Netscape, em 1995, já trazia estampada para a linguagem o novo 
nome: JavaScript. Não que tenha tanta ligação com Java, mas por 
pura questão de marketing. E assim nascia uma linguagem que se 
tornaria um padrão e sinônimo de processamento cliente em páginas 
web.
A linguagem JavaScript é tão poderosa e simples para 
manipular objetos (foi sua motivação principal manipular os 
elementos de uma página HTML) que se criou, a partir dela, um 
padrão: o ECMAScript. Vários outros setores utilizam uma 
linguagem nesse padrão, entre eles o VRML. O aplicativo 
proprietário Flash utilizava um, que depois evolui para o que eles 
hoje chamam de ActionScript, mas que mantém ainda certa 
compatibilidade.
Altos e Baixos
Criada inicialmente para pequenos processamentos, JavaScript 
foi muito utilizada para acrescentar recursos simples à página, às 
vezes banais. Esse uso é o que a faz ser lembrada como uma extensão 
do HTML e não como uma linguagem de fato.
Entretanto, JavaScript é uma linguagem de programação. Uma 
linguagem completa e poderosa, com as limitações que o meio 
exigia.
É uma linguagem que foi criada para:
• alterar valores de elementos HTML; 
• criar elementos HTML; 
• validar formulário e controlar interação entre molduras. 
Através de JavaScript você poderá ter acesso a qualquer 
elemento da página.
JavaScript reúne o que há de melhor em dois grupos 
consagrados de linguagem: listas associativas, tipagem dinâmica e 
expressões regulares de Perl (linguagem para criação de relatórios); a 
sintaxe básica, a biblioteca matemática e a de data de C/C++/Java (C 
é uma linguagem de grande peso no mundo Unix, e até nos outros; 
C++ é uma versão de C utilizando a técnica de Orientação a Objetos; 
Java é a linguagem preferida do meio acadêmico, mas que pouco a 
pouco atinge outras áreas). Se estou falando grego, desculpe-me: 
essas coisas serão tratadas adiante.
Esta linguagem pode ser utilizada de uma forma bem básica ao 
simplesmente associarmos ações simples a eventos de elementos da 
página (por exemplo, fazendo uma janela abrir ao clicarmos um 
botão de formulário HTML); de forma estruturada; ou, o que é mais 
interessante, orientada a objetos, de uma forma que lembra bastante a 
linguagem Perl.
Como tudo que é rosa tem que ter espinho, JavaScript tem suas 
limitações: só roda em um navegador web, depende do navegador do 
internauta e não lida com arquivos de maneira alguma. Mas como 
isso tudo era esperado de uma linguagem assim, podemos dizer que 
JavaScript é o que há de melhor nessa área.
Mas não é o fim para quem quer usar tantos recursos quantos 
seja necessário para a criação de uma aplicação local. O projeto 
Mozilla também apresenta um framework para a criação de 
programas gráficos normais (como usando Java/AWT ou GTK+), 
multiplataforma, usando-se JavaScript e XML, podendo inclusive ser 
executados por rede.
O Que Ela É
Atualmente, como já foi dito, é uma linguagem de 
programação que possui muitas qualidades e limitações do gênero ao 
qual pertence. Entretanto, JavaScript vinha sendo bastante 
subestimada pela comunidade de desenvolvedores em geral (pelo 
menos antes da do AJAX e da Web 2.0). Geralmente ser utilizada 
para coisas banais e amadoras.
É uma linguagem que lembra bastante C++ e Java. 
Principalmente Java. Mas traz apenas semelhanças. Ela possui 
tipagem dinâmica, o que significa que você não precisa dizer qual o 
tipo da variável, podendo armazenar nela ora inteiro, ora string. Ela 
tem o tipo booleano também. Na verdade, quando se trata de 
variáveis, elas nem mesmo precisam ser criadas, mas criá-las é 
aconselhável para que o código se torne mais compreensível.
Por sua forte ligação aos elementos HTML, ela é muito 
utilizável para efeitos visuais curiosos, pena que a "Guerra dos 
Navegadores" terminou por complicar a vida do programador 
DHTML (JavaScript manipulando diretamente partes de um 
documento HTML como objetos). Mas quem tem paciência e investe 
nisso corre o risco de se surpreender com o resultado.
Apesar da sintaxe parecer com Java, por incrível que pareça ela 
me lembra bem mais linguagens como Perl, mesmo que não tenha 
"$" antes de variável e coisas do gênero... Isso talvez seja pela 
tipagem dinâmica, pela lista - inclusive a associativa - ou talvez seja 
pelo modo como é feita a criação de classes.
No final, JavaScript parece um Perl com sintaxe de Java, com a 
difícil peculiaridade de não poder armazenar dados.
Sobre Este Manual
Como os volumes de Omega destinados a cobrir linguagens de 
programação, este livro tenta levar conhecimento bastante amplo da 
linguagem em si, mas mostrando alguns dos recursos disponíveis. 
Tenta também, como parte de Omega, traçar uma imagem - ainda que 
Introdução #5
Manual JavaScript
embaçada - da linguagem na comunidade, seu papel e uso perante os 
desenvolvedores, além de tentar definí-la como realmente é.
Aqui você aprenderá não apenas a programar em JavaScript 
como também a utilizar suas características para Orientação a 
Objetos. Isso sem contar com o uso de recursos estruturados bastante 
úteis herdados, em sua maioria, de Perl.
Não será tratado aqui nada referente a HTML ou DHTML, o 
nosso foco será JavaScript. Caso o leitor se interesse por qualquer 
dessas duas tecnologias (a primeira, inclusive, de primordial 
importância para o próprio JavaScript), sugiro que procure leitura 
especializada. Omega.javaScript tende a servir como um 
aprimoramento para quem já conhece um pouco de HTML e 
programação, e deseje conhecer melhor esta linguagem mal-
compreendida.
Conhecimento Prévio
Este livro assume que o leitor conhece já programação e, neste 
campo, tenha algum domínio sobre expressões lógicas e aritméticas, 
estruturas de repetição e de decisão, e programação Orientada a 
Objetos. Também assume-se que o leitorjá domina, muito ou pouco, 
a linguagem de hipertexto HTML. De qualquer forma, aqui vai um 
resumo de cada um desses elementos, para recordar.
Programação estruturada utiliza uma máxima: qualquer 
programa pode ser feito a partir de estruturas de decisão, de repetição 
e dos conceitos: módulos - ou funções - e seqüências. A grande 
vantagem, à qual todos os programadores até hoje agradecem, é a 
abolição dos "GOTOs", que eram os principais responsáveis por 
códigos incompreensíveis. Na programação estruturada, fala-se em 
funções e variáveis: o programador estruturado tem o poder do 
verbo.
Expressões lógicas são seqüências de variáveis do tipo valor-
verdade e expressões comparativas que retornam valores-verdade. 
Valores-verdade a que me refiro são os conhecidos booleanos, que 
podem assumir valor "verdadeiro" ou "falso" (true ou false). 
Variáveis e expressões comparativas que retornavam este tipo são 
ligadas em cadeias por operadores lógicos e parênteses. Os 
operadores lógicos são: "E", "OU", "OU EXCLUSIVO", "E 
EXCLUSIVO" e "NÃO". Para um bom uso de expressões lógicas é 
recomendado o estudo de "lógica aplicada à computação" ou "lógica 
clássica proposicional".
Expressões aritméticas retornam números. São expressões 
matemáticas e envolvem variáveis de números, números constantes e 
chamadas de funções que retornam números, separados por 
parênteses e operadores matemáticos. São operadores matemáticos: 
"MAIS", "MENOS", "VEZES", "DIVIDIDO", "DIVIDIDO-SÓ-
RESTO", "DIVIDIDO-SEM-FRACIONAR" e "ELEVADO-À-
POTÊNCIA". Quanto a expressões aritméticas, são mais fáceis de 
serem compreendidas pelo fato de serem um pouco estudadas nos 
ensinos fundamental e médio.
Estruturas de repetição são blocos de código que são repetidos 
um determinado número de vezes ou até que certa condição seja 
atingida. A condição é o resultado de uma expressão lógica.
Estruturas de decisão são blocos de código que são executados 
apenas se dada condição for verdadeira. Algumas vezes, 
acompanhados de blocos que são executados somente se a mesma 
condição avaliada for falsa. A condição é também o resultado da 
avaliação de uma expressão lógica.
Programação Orientada a Objetos revolucionou a programação 
ao criar elementos complexos, que reúnem comportamento (métodos, 
parecidos com as funções da Programação Estruturada), estado 
(atributos, parecidos com as variáveis da P.E.) e identidade (como as 
variáveis, algo que os distingue uns dos outros). Há o conceito de 
classes, que são "moldes" para esses elementos complexos, chamados 
de objetos. Entre classes há associações. Entre estas, algumas são 
especialmente interessantes, como a herança - que é quando uma 
classe é, a princípio, igual a outra: claro que apenas a princípio, aí 
acrescentamos ou retiramos algo. Programação Orientada a Objetos é 
algo realmente interessante e útil. Se o leitor não conhece esta forma 
de programar, talvez sinta dificuldade na seção que trata a Orientação 
a Objetos em JavaScript. Recomendo fortemente que busque, caso 
seja este seu caso, informações sobre este que é um dos conceitos 
mais utilizados na programação atual - apesar de não ser coisa tão 
nova assim... Você pode recorrer a livros, mas há de encontrar 
alguma coisa se fizer pesquisas na Internet sobre o assunto.
HTML é uma linguagem de hipertexto, utilizada para a criação 
de páginas na Internet. Ela serve, na verdade, para o que poderíamos 
chamar de "diagramação da web". Atualmente está começando a ser 
substituída por XML, sendo XHTML a linguagem transitória. 
Acontece que isto está acontecendo ainda em nível muito superficial 
e certamente levará um tempo até que seja mesmo substituída. Como 
uma linguagem de marcação de hipertexto, HTML oferece TAGs, 
que utilizamos para determinar locais onde objetos aparecerão e 
inserir os objetos. Quando se fala de "aplicação para web", isso não 
descarta HTML, muito pelo contrário: todo o processamento de um 
aplicativo que roda em um servidor precisa mostrar alguma coisa ao 
usuário e para isso não há como evitar o uso de uma linguagem de 
marcação, geralmente HTML mesmo.
Não é fundamentalmente necessário que você conheça 
Orientação a Objetos, HTML ou expressões lógicas, mas tal 
desconhecimento poderá acarretar na dificuldade de compreender 
alguns trechos deste manual.
Software Necessário
Para trabalhar com JavaScript você vai precisar de um 
computador com um Sistema Operacional, um software navegador 
com suporte a JavaScript e um editor de textos ASCII qualquer. 
Texto puro mesmo. Claro que editores especiais para programação 
que ofereçam destaque sintático da linguagem JavaScript e outra 
facilidades são bem mais interessantes e confortáveis de se usar.
Há infinitas combinações possíveis para se trabalhar JavaScript 
mas, por ser este um volume de Omega, uma enciclopédia do 
software livre, mediante as vantagens já faladas no volume principal 
desta categoria de software, recomendamos a seguinte combinação: 
GNU/Linux (o sistema operacional), Mozilla (o navegador) e Kate (o 
editor). Claro que há muitas outras opções, como o FreeBSD como 
Sistema Operacional, o Galeon como navegador e o emacs como 
editor, portanto sinta-se à vontade para escolher sua combinação: o 
S.O. certamente será um que você já tenha instalado e e venha 
usando; o navegador você provavelmente já tem também; o editor 
pode ser provisoriamente o editor de texto padrão/preferido-seu em 
seu sistema, se você não tiver ainda um editor com destaque 
sintático.
Mas, enfim, por incrível que pareça, é só disso mesmo que 
você vai precisar.
Introdução #6
Manual JavaScript
Programando EstruturadamenteProgramando Estruturadamente
Neste capítulo trataremos todos os detalhes da linguagem JavaScript para programação estruturada. Pelo menos é este 
o objetivo, mas certamente não será atingido assim de início. Caso o leitor não entenda muito de programação 
estruturada, sugiro que busque leitura sobre "algoritmo", pois é fundamental.
Tipos de Variáveis
Variáveis servem para armazenar "coisas" que serão utilizadas 
no decorrer de um programa ou parte dele. Eu poderia dizer que 
armazenam valores ou dados, mas acredito que "coisas" é uma 
definição melhor: pois podem ser números, cadeias de caracteres, 
objetos e até, estranhamente, funções!
Em JavaScript lidamos com alguns tipos básicos. São eles: 
número, valor-verdade e cadeia de caracteres. Para facilitar a 
abordagem, vamos esquecer que variáveis podem guardar referência a 
funções ou se referir a objetos e consideremos a existência de apenas 
esses três tipos de dados básicos - são, afinal de contas, os únicos 
citados que podem ser classificados como "tipos básicos".
Variáveis do tipo número guardarão números que poderão ser 
positivos, nulos ou negativos, inteiros ou fracionários (pois na 
verdade os computadores não guardam números reais. Tanto que é 
preferível tratar o que os computadores guardam como pontos 
flutuantes ao invés de se usar o termo "reais"). Com eles pode-se 
fazer operações matemáticas em geral. Na verdade, é provável que 
JavaScript separe inteiros de flutuantes, mas isso é totalmente 
transparente ao usuário. Outra coisa interessante sobre números e 
JavaScript é que a linguagem também representa números 
absurdamente grandes, chamando-os de Infinity positivo e negativo. 
Assim, não ocorrerá necessariamente um erro ao se tentar dividir por 
zero, por exemplo.
Variáveis do tipo valor-verdade armazenam apenas verdadeiro 
ou falso, em JavaScript, como na maioriadas linguagens, 
representados, respectivamente, por true e false. Algumas linguagens 
não trazem este tipo, exigindo o uso de números: 1 representando 
verdadeiro e 0 representando falso. Felizmente JavaScript implementa 
valores-verdades, conhecidos como booleanos.
Variáveis do tipo cadeia de caracteres armazenam cadeias - ou 
seqüências - de caracteres. Um caractere pode ser uma letra, um 
número, uma exclamação, um arroba... Qualquer símbolo gráfico que 
possa fazer parte de um arquivo de texto puro. Eles são representados 
com uma regra própria, que é a mesma de muitas linguagens 
existentes: devem ser colocados entre aspas (") ou apóstofros ('). Se 
você utilizar aspas, os apóstofros que aparecerem no código serão 
tratados como caracteres, e vice-versa. Para imprimir alguns 
caracteres especiais, você pode utilizar a contra-barra (\). Ela indica 
que o que vem depois representa um caractere especial. Assim, um \n 
representa uma quebra de linha (do texto, não do HTML), o \" 
representa aspas mesmo e \\ se refere ao caractere (\).
Você não precisará se preocupar tanto com tipos em JavaScript. 
Isso porque, como já foi dito, ela oferece tipagem dinâmica, o que 
quer dizer que uma variável é tratada como variável, não como 
variável inteira ou variável booleana. Assim, uma variável pode 
assumir qualquer tipo no decorrer do programa.
Variáveis não precisam ser declaradas, mas sua declaração é 
muito importante para mantermos programas bem-organizados. Para 
declarar uma variável, utilize a palavra-chave var antes do nome. 
Cada variável deve ser declarada apenas uma vez (ou nenhuma, se 
não quiser fazê-lo).
Operadores
Há cinco grupos de operadores, basicamente falando: lógicos, 
comparativos, aritméticos, de strings e de atribuição.
Operadores lógicos retornam um valor-verdade a partir de um 
ou mais valores-verdades. Há o E (&&), que retorna verdadeiro se, e 
somente se os dois valores passados forem verdadeiros. Seu uso é 
como em "A &&B". O OU (||) retorna verdadeiro se pelo menos um 
dos valores passados for verdadeiro. Seu uso, similar ao do E, é como 
em "A || B". Há, para concluir, a negação (!), que retorna verdadeiro 
se o valor recebido for falso. Seu uso é como em "!A". Pode-se 
agrupar esses operadores e variáveis em expressões complexas e, 
como em expresões aritméticas, utilizar-se parênteses para controlar a 
ordem em que a expressão será avaliada. Exemplo de expressão 
lógica (A, B, C e D são variáveis booleanas): ( A && (B || ( !(C || D) ) 
) ). Isso será verdadeiro para as seguintes combinações de A, B, C e 
D: VVFF, VVFV, VVVF, VVVV e VFFF. Tente visualizar isso.
Operadores comparativos recebem dois valores e os comparam, 
retornando um valor-verdade. Existem para serem utilizados em 
expressões lógicas. A igualdade (==) compara duas variáveis de 
qualquer tipo básico e retorna verdadeiro se: são numericamente 
iguais (no caso de números) ou são literalmente iguais (no caso de 
strings). Seu uso é como em "A==B", "A==2.3" ou "A=='Console'". 
A desigualdade (!=) funciona como "!(A==B)" funcionaria para 
"A==B". Ela nega a igualdade e é usada como em "A!=B", "A!=7.8" 
ou "A!='Terminal'". Os outros quatro operadores são exclusivamente 
numéricos: são o maior que (>), o menor que (<), o maior que ou 
igual a (>=) e o menor que ou igual a (<=). Seu uso é bastante 
intuitivo: "A>B" retornaria verdadeiro para A=2 e B=-3, por 
exemplo. O (A<=B) equivale à expressão: ( (A < B) || (A == B) ).
Operadores aritméticos recebem números e retornam números. 
São os já conhecidos: soma (+) - de uso como em "A+B" ; subtração 
() - de uso como em "A-B" -; multiplicação (*) - de uso como em 
"A*B" -; divisão (/) - de uso como em "A/B" - e mais outros. Há a 
divisão em modo anel - ou o resto de uma divisão inteira, se preferir 
nesses termos - (%), que é usado como em "A%B" e para "16%5" 
retornará "1", por exemplo. A potência ( ) é como em "AB" e para "5^2" 
resultará "25".
O operador de string que existe é a concatenação, representado 
como "+". Assim, "E-mail " + 'enviado!' resultará na string "E-mail 
enviado!".
Os operadores de atribuição servem basicamente para 
atribuirmos valores a variáveis. O principal é o de atribuição simples 
(=), que é utilizado na forma "A=B", B podendo ser uma variável, 
uma expressão lógica, aritmética, de string... Os outros operadores - 
exceto os lógicos - podem ser associados ao igual, criando-se outros 
operadores de atribuição. A saber: (+=) como incrementação para 
valores numéricos, "A+=B" incrementa "A" com "B"; (+=) como 
concatenação para strings, "A+=B" adiciona o valor de "B" à string 
"A"; (-=) decrementação para valores numéricos, decrementa "B" de 
"A" e se "hora" tem valor "8", "hora-=5" dará à "hora" valor "3"; ( 
*=@ ), (/=) e ( @%= ) funcionam da mesma forma.
Entre os operadores de atribuição, há os operadores especiais 
de incremento (++) e decremento (--). O operador de incremento 
aumenta o valor da variável em 1. Já o de decremento faz exatamente 
Programando Estruturadamente #7
Manual JavaScript
o contrário, decrementando o valor da variável de 1. Esses operadores 
podem ser utilizados aplicados a uma variável como um comando ou 
dentro de expressões aritméticas. Neste caso, haverá diferença entre 
colocá-los antes ou depois da variável. Quando antes, primeiro é feita 
a alteração e depois a expressão é avaliada. Quando depois, a variável 
só é incrementada ou decrementada depois de a análise à expressão 
ter sido concluída. Isso quer dizer, para ser mais preciso, que:
x = 2 * y++
resultará, para x, em um valor diferente de
x = 2 * ++y
Vamos supor que, antes de tudo, y tenha o valor "5". No 
primeiro caso, terminaremos com x=10 e y=6. No segundo, x será 12 
e y, 6.
Listas
Um tipo mais complexo de dado, mesmo sendo já orientado a 
objetos (vamos abstrair isso, por enquanto) é a lista ou vetor. Uma 
lista é uma estrutura que permite o armazenamento de várias variáveis 
com um mesmo nome, acessíveis por um índice. Este índice pode ser 
numérico começando por zero (listas indexadas) ou uma string 
qualquer (listas associativas ou hashs). Ao contrário das variáveis 
básicas, as listas precisam ser criadas como listas mas, como uma 
linguagem de script, você não precisa dizer de que tipo é a lista, 
podendo misturar string com booleanos e números. A criação de uma 
lista é feita através do comando:
var x = new Array()
Este comando criará uma variável "x" e determina que esta 
contenha uma lista.
Cada elemento da lista pode ser acessado por [i], sendo i o 
índice do correspondente ao elemento na lista ou a chave para acessá-
lo, caso seja associativo. A lista é criada vazia. Podemos adicionar um 
elemento indexado através do comando:
x.push("Olá, este é o primeiro 
elemento!")
Assim, quando requisitarmos x[0], será retornada a string 
"Olá, este é o primeiro elemento!". "x.length" retornará o tamanho da 
lista indexada.
De forma análoga, se queremos retirar um elemento da lista à 
moda de pilha (último a entrar é o primeiro a sair, podemos utilizar o 
comando seguinte:
y = x.pop()
Este código retirará o último elemento adicionado à lista e 
colocará em y. O elemento deixará de constar na lista.
Se quisermos trabalhar com lista associativa, podemos incluir o 
elemento da seguinte forma:
x["Saci"] = "Negrinho de uma perna só, 
personagem do folclore brasileiro."
Assim, através de x["Saci"] poderemos associar o texto 
colocado. Isso é muito útil, pois tem base no conceito de listas de 
duplas strings, associando-as por chave e valor. Como o leitor já deve 
ter percebido por esse exemplo,esta estrutura pode ser utilizada para 
um dicionário de verbetes (não que isso seja tão útil assim em 
JavaScript), para associar apelidos a nomes, apelidos a e-mails e 
muitas outras coisas. Mais à frente você verá como fazer acessar de 
forma mais eficiente todos os elementos de uma lista.
Uma observação final é: tenha cuidado ao usar o push e o pop: 
alguns softwares que pretendem se passar por "navegadores com 
suporte a JavaScript" não suportam ainda esse recurso tão simples. 
Para substituí-los, há a seguinte alternativa:
x[ x.length ] = valor; y = x[ x.length-
1 ]
que equivalem a:
x.push(valor); y = x.pop()
com a diferença de que o pop exclui o último elemento e a 
linha equivalente não o faz. Até onde vi, felizmente, a falta de suporte 
aos métodos push e pop ocorre em navegadores antigões.
Estrutura Básica
A primeira coisa que se deve tem em mente sobre programação 
estruturada é que os comandos deverão ser executados 
seqüêncialmente. A segunda coisa que se deve saber é o que são 
comandos e como criar essas seqüências.
Um comando é uma atribuição, uma chamada de valor ou um 
bloco de código (estrutura de repetição ou decisão). Um bloco de 
código pode conter listas de comandos, inclusive com outros blocos 
de código, em hierarquias de qualquer tamanho.
Os comandos podem ser colocados naturalmente, separados. 
Em muitas linguagens, é preciso colocar ponto-e-vírgula para separar 
dois comandos distintos, mas não em JavaScript, a memos que você 
coloque comandos em uma mesma linha. Isso não quer dizer que 
você não possa utilizá-los no fim das linhas, e sim que o interpretador 
JavaScript irá ignorar aquilo. Assim o identificador de fim de 
comando pode ser tanto a quebra de linha como o ponto-e-vírgula.
Outra informação importante: JavaScript é sensível à caixa. O 
que isso significa? Uma variável criada como "vaLOR" se chamará 
exatamente "vaLOR" e não adianta tentar acessá-la com "Valor", 
"valor" ou "VALOR". Isso serve para tudo.
Estruturas de Repetição
Trata-se de um comando simples - ou um bloco de comandos - 
que será executado mais de uma vez dentro do código maior. 
JavaScript utiliza as três estruturas de repetição básicas do C: o while, 
o do-while e o for, este último, além da forma tradicional, de uma 
outra maneira bastante útil para listas associativas.
while
O while (enquanto) repete um comando ou conjunto de 
comandos enquanto uma determinada expressão lógica for 
verdadeira. Por exemplo, o código
while (x < 10)
 x++
incrementará x um determinado número de vezes. Quantas 
vezes? Depende... Talvez nenhuma. Ele incrementará x o número de 
vezes que for preciso para que x não seja mais menor que 10.
Programando Estruturadamente #8
Manual JavaScript
do-while
O do-while (faça enquanto) funciona de maneira muito 
parecida com o while, com a diferença de que a operação é efetuada 
ao menos uma vez (por isso o FAÇA primeiro e o ENQUANTO 
depois). Assim, no exemplo, o comando:
do
 senha = prompt("Digite a senha")
while (senha != "abrakadabra")
repetirá a operação de solicitação da senha até que esta seja 
"abrakadabra". O código diz para que ele "faça solicitação de senha 
enquanto a senha for diferente de abrakadabra".
for
O for (para) faz uma operação um determinado número de 
vezes, percorrendo dado intervalo. Seu uso convencional é da 
seguinte forma:
for (i = 0; i < 10; i++)
 alert(i)
Desta forma, a variável i será inicializada com 0 e serão 
jogadas ao usuário 10 janelas de alerta, cada uma apresentando um 
número, do 0 até o 9, pois a cada iteração o i é aumentado em 1.
De um modo geral, há três expressões. A primeira é um 
comando que será executado apenas antes da primeira iteação. A 
segunda é uma expressão booleana que serve de condição. Toda vez 
que for iniciar uma nova iteração, o JavaScript checará se a expressão 
retorna verdadeiro. Caso retorne, ele pára; senão ele continua. A 
terceira é outro comando, mas este é executado depois de toda a 
iteração. Desta forma, o uso convencional do for é:
for ( inicializacao(); booleano; 
operacao() )
 comandos()
E isso equivale a:
inicializacao()
while (booleano) {
 comandos()
 operacao()
}
Bem, este é o uso convencional, mas há um outro uso, que é 
muito interessante, por sinal. É uma forma de percorrer uma lista 
associativa. Suponhamos que você criou uma lista de links 
associando nome a endereço, sendo o nome a chave, com comandos 
como:
lista["Ufal"] = "http://www.ufal.br"
Agora você quer escrever os links mesmo, em sequência. Como 
fazer? Lembrar todas as chaves? Nem pensar! É para situações como 
esta que o for funciona como o foreach do Perl, caso você o conheça. 
Caso contrário, sem problemas: a idéia é simples.
Para todo elemento da lista, você vai ter a chave. Ou seja, 
percorre-se toda a lista, mas ao invés de a variável que a percorre 
assumir um valor numérico, como no uso tradicional do for 
convencional (sim, pois o for na verdade é bastante flexível), ela 
assume os valores-chaves. Isso já está ficando meio confuso, não é 
mesmo? Bem, então vamos a um exemplo que melhora:
for (i in lista)
 document.write("<a href='" + lista[i] 
+ "'>" + i + "</a><br>")
O que isso faz? Simples! Escreve todos os links contidos na 
lista associativa (nome ->endereço) "lista". É só isso mesmo. 
Entretanto, há uma questão a se considerar: não estou certo de que 
isso funciona corretamente no Internet Explorer, da Microsoft. Isto já 
foi testado no Netscape 4, no Mozilla e no Opera, funcionando 
corretamente em todos eles.
Estruturas de Decisão
As estruturas de decisão servem para executar uma dada 
operação (ou, como sempre pode ser, um conjunto de operações), 
dependendo de uma determinada condição ser verdadeira. Há três 
tipos básicos de estruturas de decisão: o IF, o SWITCH e a forma 
condensada do IF.
if
O if (se) pode ser utilizado de duas formas diferentes. A forma 
mais simples é quando queremos que um código seja executado caso 
uma dada expressão seja verdadeira. A forma é:
if (condicao)
 comando
Por exemplo, o código a seguir não permite que x assuma valor 
superior a 100. Assim, após passar por este trecho de código, x 
necessariamente será menor que ou igual a 100.
if (x > 100)
 x = 0
A forma completa do if traz também a opção "else", a ser 
executada caso a condição não seja verdadeira. Sua forma é
if (condicao)
 comando-se-verdadeiro
else
 comando-se-falso
Assim podemos fazer com que o código possa seguir um entre 
dois caminhos distintos, dependendo de um dado valor. No exemplo 
a seguir temos um trecho de código que verifica se x é par ou ímpar.
if ( (x % 2) == 0)
 statusDeX = "x é par"
else
 statusDeX = "x é ímpar"
Programando Estruturadamente #9
Manual JavaScript
switch
O switch permite que, ao invés de optar entre apenas duas 
opções, possamos optar entre várias opções, uma para cada valor de 
uma dada variável ou expressão aritmética. O normal é que o switch 
seja utilizado para números, mas em JavaScript ele pode ser utilizado 
para variáveis do tipo string também! Veja o uso
switch (variavel) {
 case opcao1: comando
 case opcao2: comando
 ...
 case opcaon: comando
}
O switch verificará se a variável é "opcao1". Se não for, ele 
fará a verificação com "opcao2", e assim por diante até encontrar a 
igualdade. Quando encontrá-la, o switch simplesmente não verificará 
mais nada e executará todo o código que vier até o fim do switch, 
inclusiveo das verificações seguintes. Por isso, uma forma mais 
utilizada do switch é:
switch (variavel) {
 case opcao1: comando; break
 case opcao2: comando; break
 ...
 case opcaon: comando; break
}
No código apresentado, ao encontrar um case que seja igual à 
variável, o switch executa o comando e pára. Para mais de um 
comando, basta colocar o break no fim. Mais de uma opção pode ser 
colocada em um case, como em todas as estruturas de repetição e 
decisão. Para isso, basta que coloquemos todos os comandos entre 
chaves onde colocaríamos um comando apenas. Mas vejamos um 
exemplo de switch: vamos fazer um trecho de código que escreva na 
tela a posição de alguns dos jogadores da Seleção na Copa 2002.
switch (jogador) {
 case "Marcos" : document.write("É o 
goleiro titular, camisa 1!"); break
 case "Ronaldo": document.write("O 
camisa 9 está de volta e é artilheiro."); 
break
 case "Rivaldo": 
document.write("Herdou a camisa 10 foi o 
'real' melhor da copa."); break
 case "Edmilson": 
document.write("Zagueiro, mas acho que 
ainda não falaram pra ele.")
}
if condensado
O IF condensado de que falo é na verdade um operador ternário 
de decisão. Por ser de decisão (algo não exatamente trivial por 
envolver expressões lógicas), achou-se melhor que fosse colocado 
nesta seção. Bem, você viu o exemplo anterior do if, não? O operador 
ternário IF condensado serve quando temos uma variável e desejamos 
atribuir a ela um valor dependendo de uma expressão. Exatamente o 
caso do exemplo. Veja o uso:
variavel = (expressao) ? 
valorSeVerdadeiro : valorSeFalso
É simples de usar quando a gente entende, e ajuda muito. É 
menos útil que o if, mas é um comando bastante poderoso (no sentido 
de que faz muito em poucas linhas. No caso, uma). Veja como fica 
aquele if em versão condensada:
statusDeX = ( (x % 2) == 0) ? "x é par" : 
"x é ímpar"
Modularização
Às vezes acontece de precisarmos utilizar uma determinada 
seqüência de comandos em vários cantos. A modularização resolve 
este problema, permitindo que escrevamos módulos de código-fonte, 
que possam ser chamados a qualquer momento.
Os módulos - também conhecidos como funções, 
procedimentos ou rotinas - são suportados por JavaScript, assim 
como o são por qualquer linguagem que tenha um mínimo de 
estrutura. Eles são construídos através da palavra reservada function, 
como segue:
function funcao() {
 comando;
 comando;
 ...
}
Dentro de uma função pode haver praticamente qualquer tipo 
de comando que poderia ser executado fora dela, incluindo estruturas 
de decisão, repetição e tudo o mais. Algumas vezes temos uma idéia 
geral aplicável a qualquer string ou número. Podemos passar um 
valor por parâmetro para a função para que a operação seja feita. Por 
exemplo, a função a seguir retorna um texto pré-definido envolvendo 
um valor passado por parâmetro:
function exibe(str) {
 alert("Olá! Olha só: " + str + " Não 
é incrível?")
}
Uma chamada como "exibe('essa função exibe mesmo.')" 
mostrará uma janela de aviso com a seguinte string: "Olá! Olha só: 
essa função exibe mesmo. Não é incrível?". Claro que esta função não 
vai ser de grande utilidade: é apenas ilustrativa. Você pode fazer com 
um valor passado por parâmetro qualquer operação que você poderia 
fazer se ele fosse uma variável normal.
Uma função também pode retornar um valor e isso é feito com 
uso da palavra reservada return. O exemplo a seguir mostra uma 
função que retorna um número inteiro unitário por extenso.
function umPorExtenso(n) {
 switch (n) {
Programando Estruturadamente #10
Manual JavaScript
 case 0: str = "zero"; break
 case 1: str = "um"; break
 case 2: str = "dois"; break
 case 3: str = "três": break
 case 4: str = "quatro"; break
 case 5: str = "cinco": break
 case 6: str = "seis"; break
 case 7: str = "sete"; break
 case 8: str = "oito"; break
 case 9: str = "nove"
 }
 return str
}
Assim, podemos escrever "alert(umPorExtenso(5))" e ver na 
tela o nome "cinco". Ao trabalharmos com valores numéricos, 
podemos fazer funções JavaScript que funcionem exatamente como 
funções matemáticas específicas.
As últimas coisas que resta dizer sobre funções: o nome de uma 
função pode ser passado como parâmetro para outra função. O código 
a seguir chama dez janelas, cada um com um número, de 0 a 9. Teste.
function fazDezVezes(func) {
 for (var i = 0; i < 10; i++) {
 func(i)
 }
}
fazDezVezes(alert)
Outra é que uma função pode ser declarada de uma forma 
diferente:
var fazDezVezes = function (func) { for 
(var i = 0; i < 10; i++){func(i)}}
E também podemos atribuir uma função a uma variável, como 
segue:
var oMesmo = fazDezVezes
Sobre Parâmetros
Os parâmetros passados para uma função podem ser o número 
que ela suporta, ou menos. Por isso, às vezes se utiliza de uma 
estranha estrutura, como segue:
function bomDia(usr) {
 aux = (usr) ? usr : "usuário anônimo"
 alert("Bom Dia, " + usr + "!!")
}
Isso significa que se a função for chamada como bomDia(), a 
frase que aparecerá será Bom Dia, usuário anônimo!!. Isso é muito 
útil em alguns casos, especialmente nos construtores de classes, como 
você verá na próxima seção.
Programando Estruturadamente #11
Manual JavaScript
Programando com Orientação a ObjetosProgramando com Orientação a Objetos
Antes de Começar
A forma de programar em que simplesmente se ordena que 
coisas sejam executadas em seqüência - forma conhecida como 
Programação Estruturada ou Imperativa - não é a única forma de se 
criar um programa. Há algumas outras e, nos últimos anos, tem se 
destacado cada vez mais uma dessas formas, mas uma forma 
específica, a Orientação a Objetos.
Chamadas de Paradigmas, formas de programar têm muita 
diferença entre si e sair de uma para outra exige uma mudança de 
visão. É preciso ver as coisas de outro modo. No caso específico de 
Programação Orientada a Objetos, temos um paradigma que derivou 
de dois outros: a Programação Estruturada e a Funcional. Este 
paradigma realmente mostra as coisas funcionando de outra forma 
mas, por trazer muita semelhança com a Programação Estruturada, é 
possível que se aprenda sua técnica e não seu espírito. Como 
resultado disso, teríamos alguém que programa utilizando uma 
linguagem orientada a objetos, mas não o paradigma, fazendo as 
coisas quase que da mesma forma que faria em uma linguagem 
estruturada.
JavaScript implementa, até certo ponto, as vantagens da 
Programação Orientada a Objetos, permitindo seu uso. Está fora do 
escopo deste livro tratar a programação orientada a objetos 
diretamente, como paradigma, por isso não espere muito da sessão 
seguinte, que prentende apenas orientar o leitor, se me permite o 
trocadilho. Para um estudo mais aprofundado da Programação 
Orientada a Objetos, sugiro que recorra à literatura apropriada.
Orientação a Objetos
Na Programação Orientada a Objetos, temos trechos de código 
que representam objetos. Objetos digitais estão jogados em um 
ambiente montando um inteiro.
Composição
Um objeto pode ser composto por valores 
(computacionalmente falando, inteiros, strings, booleanos...) e outros 
objetos.
Considere como coisas simples uma barra de ferro ou madeira, 
um pedaço de vidro ou qualquer elemento feito apenas com um 
material. Assim sendo, uma automóvel não é uma coisa simples, mas 
um objeto. Poderíamos falar diretamente do volante (e até comprá-lo 
separadamente),daí temos que o volante é outra coisa. Faz parte do 
carro, mas existe completamente, mesmo sem carro (se vai ser útil ou 
não sem o carro é uma outra questão). Mas o volante é simples? Não, 
é um outro objeto. E assim temos objetos e mais objetos se 
compondo, uns formados por outros, até um momento em que não 
há mais objetos, apenas coisas simples.
Classes
Classes representam uma categoria de objetos e é aqui que a 
coisa começa a complicar para quem não está muito acostumado. Ao 
invés de explicar de cara, vou começar com um exemplo. Vamos 
imaginar um Ford Ka. Não gosto de fazer propaganda de A ou de B, 
mas os detalhes são fundamentais neste ponto. Imagine um azul, 
placa ABC-1234, com um adesivo Jota Papelaria no vidro de trás e 
um arranhão pequeno na porta do motorista. Claro que um carro tem 
muito mais detalhes do que isso, mas vamos parar por aqui. Este 
carro é um objeto, certo?
Agora vamos ver um outro Ka, mas este é branco, novo, com 
os pneus gastos, com um adesivo em cada porta de um escudo do 
Vasco (não sou vascaino). A placa ZXC-8765, e uma imagem de 
Nossa Senhora no canto inferior esquerdo do vidro da frente.
Esses dois carros não tem nada a ver um com o outro, não é 
verdade? Mas tem... O que têm a ver? Têm a ver que os dois são 
Fords Ka e, portanto, muito parecidos apesar de tudo. Os dois têm 
uma mesma composição (se forem do mesmo ano) de portas, bancos, 
volantes, motor... Mas o motor de um pode estar mais gasto que o do 
outro, assim como os pneus estavam. Mas mesmo assim, esses 
componentes também têm uma coisa em comum: são do mesmo tipo. 
Em Orientação a Ojetos, da mesma classe.
Herança
Pode-se dizer que o ZXC-8765 do exemplo anterior era um 
carro, certo? Mas pode-se dizer também que ele era um Ford Ka. 
Como pode ser duas coisas se era apenas um objeto? Na verdade, 
isso ocorre porque o Ford Ka é um carro.
Esse papo parece meio óbvio e confuso, não? O que é preciso 
ver exatamente é que o ZXC-8765 não é simplesmente um carro e 
que nenhum carro é simplesmente carro. Todos têm um modelo de 
alguma indústria que os define melhor.
O que se deve entender também é que o Ford Ka é um carro. O 
que isso significa? Significa que a idéia do Ford Ka tem todas as 
características referentes à idéia de carro, por herança.
Quais são as características de carro? Possuem pneus, andam 
no chão deslizando os pneus. Possuem motor e lugar para alguém 
que o conduza, dito motorista. Quais as de um Ford Ka? Todas as de 
um carro, mais: são exatamente 4 os pneus e muitas outras.
Quando dizemos que uma classe A herda de outra classe B, 
queremos dizer que todo objeto x que seja feito segundo as normas 
de A, sendo considerado um A, será também considerável como um 
B.
Usando Objetos
Um objeto é uma coisa que agrupa variáveis (aqui chamadas 
de atributos) e funções (aqui chamadas de métodos). A grande 
vantagem ao usar objeto é que, além de agruparmos coisas que têm a 
ver entre si, elas passam a ser mais integradas.
Um atributo é acessado com um ponto depois do nome do 
objeto, seguido do próprio atributo. É como se fosse uma variável e 
pode ser utilizado da mesma forma.
Um método também é acessado dessa forma, mas com 
parênteses depois. Enfim, é tudo quase igual. Assim, os comandos a 
seguir são válidos.
zxc.cor = "white"
Programando com Orientação a Objetos #12
Manual JavaScript
zxc.andar()
mensagem = (zxc.arCondicionado) ? "Tem 
ar condicionado" : "Não tem ar 
condicionado"
Um objeto funciona como um vetor associativo. Assim, você 
pode acessar a cor, por exemplo, também com:
zxc["cor"] = "white"
Estrutura with
Se você pretende tratar um só objeto, pode utilizar o comando 
with, utilizado assim:
with (zxc) {
 cor = "white"
 andar()
}
Isso colabora para que você poupe tempo e caracteres, o que 
pode ser muito importante em JavaScript, já que tudo vai ser 
transferido pela rede antes de ser interpretado.
A Criação de Classes
O esquisito de O. O. em JavaScript é justamente aqui, na 
criação de classes. Uma classe, em JavaScript, é apenas uma função. 
A única coisa que difere é que nesta função você utilizará o this para 
agregar atributos e métodos. O this referencia não somente a própria 
classe, mas o objeto específico durante sua execução. Este.
Para adicionar um atributo, basta escrever 
this.nomeDoAtributo. Se for um objeto, você deve instanciá-lo: 
this.lista = new Array(). Para adicionar um método, você deve 
utilizar aquela forma estranha de definição de função: this.escreve = 
function() { document.write( this.texto ) } define um método escreve 
que escreverá o conteúdo do atributo texto deste objeto.
Classe Data
Vamos ver se as coisas clareiam um pouco mais com um 
exemplo: trata-se de uma clássica classe de Data que escreve a data 
por extenso e na forma simples.
function Data(dd, mm, aa) {
 this.dia = dd
 this.mes = mm
 this.ano = aa
 this.extenso = false
 this.obtemExtenso = function() {
 switch (this.mes) {
 case 1: mmm = "janeiro"; 
break
 case 2: mmm = "fevereiro"; 
break
 case 3: mmm = "março"; break
 case 4: mmm = "abril; break
 case 5: mmm = "maio"; break
 case 6; mmm = "junho"; break
 case 7: mmm = "julho"; break
 case 8: mmm = "agosto"; 
break
 case 9: mmm = "setembro"; 
break
 case 10: mmm = "outubro"; 
break
 case 11: mmm = "novembro"; 
break
 case 12: mmm = "dezembro"; 
break
 }
 return this.dia + " de " + mmm + 
" de " + this.ano
 }
 this.obtemSimples = function() {
 return this.dia + "/" + this.mes 
+ "/" + this.ano
 }
 this.escreve = function() {
 if (this.extenso) {
 document.write( 
this.obtemExtenso() )
 } else {
 document.write( 
this.obtemSimples() )
 }
 }
}
Esta classe, apesar de simples, já mostra algo interessante: 
permite que você escolha a forma na qual a data será escrita. Assim, 
devemos criar um objeto do tipo data como segue:
var d = new Data(10, 07, 2002)
Uma vez feito isso, se escrevemos:
d.extenso = true
Ao digitarmos d.escreve(), a data será escrita por extenso. Sem 
isso, ela será escrita na forma normal.
Programando com Orientação a Objetos #13
Manual JavaScript
Composição
É muito simples o conceito. Tão simples que não há muito o 
que falar. Um objeto é uma variável. Uma classe pode definir 
atributos, que são variáveis. Por conseqüência, um atributo pode 
também ser um objeto e esse o ponto chave. É só colocar 
this.atributo = new Classe(params) e pronto.
Herança
A herança, como já foi explicado no tópico paradigma, é 
quando queremos dizer que uma classe A é, de certa forma, uma 
especialização da classe B.
Um dos exemplos mais clássicos disso é o de Pessoa. Vamos 
supor uma classe Pessoa. Ela teria como atributos nome, endereço, 
telefone, e-mail... Agora queremos uma Pessoa Física. Basta 
acrescentarmos o CPF e outras coisas mais. Não é interessante re-
escrever tudo. Uma Pessoa Jurídica teria o CNPJ. No final, a classe 
Pessoa deveria ter o que há em comum entre Pessoas Físicas e 
Jurídicas. Usando herança, nós não precisaremos re-escrever tudo, 
basta dizermos que PessoaFisica, apesar de ter CPF e outras coisas, é 
uma Pessoa. O mesmo com Pessoa Jurídica.
JavaScript possui um jeito muito esquisito de se definir isso: 
com o protótipo da função (é o construtor da classe, mas para o 
JavaScript ainda é uma função). O acesso é na forma 
constructorDaClasse.prototype = new construtorDaClasseMae.Apenas isso. Sem parênteses mesmo! Lembre que em JavaScript o 
construtor da classe é o próprio nome da classe.
Vamos a um exemplo. Vamos supor que já existe uma classe 
Pessoa, inclusive com um método escrever() que escreve na tela 
todos os seus dados na forma Campo: Valor
function PessoaFisica() {
 this.cpf
 this.setCPF(n) {
 this.cpf = n
 }
 this.escrever() {
 parent.escrever()
 document.write("CPF: " + 
this.cpf + "\<BR\>")
 }
}
Este código está muito simples e falta alguma coisa, não? Falta 
dizermos que uma pessoa física é também uma pessoa. Para isso, 
devemos escrever (depois de escrita toda a classe) a linha já 
apresentada:
PessoaFisica.prototype = new Pessoa
Com isso temos que uma pessoa física é também uma pessoa.
Outra coisa interessante que ainda não foi dita é o parent. É a 
forma de acessar métodos da classe-mãe. A chamada que está na 
classe PessoaFisica significa Classe-mãe.escrever()
.
Programando com Orientação a Objetos #14
Manual JavaScript
Iara JavaScript Code StandardsIara JavaScript Code Standards
Este padrão está sendo proposto para tornar possível:
1. O código JavaScript escrito por qualquer pessoa que siga 
este padrão seja compreendido e modificado por qualquer 
outra pessoa que também conheça este padrão sem qualquer 
problema; 
2. A escrita de códigos JavaScript pequenos, que possam ser 
transferidos pela Internet gerando tão pouco tráfego quanto 
for possível; 
3. Reunir boas práticas de codificação. 
Como se pode notar facilmente, o ítem 2 parece conflitar com 
o ítem 3. Por isso, procuramos criar um meio termo entre os dois: um 
código bem-escrito e enxuto ao mesmo tempo. É neste ponto que 
reside o maior trabalho na elaboração deste padrão.
Indentação
1. Não se deve utilizar o demarcador de fim-de-código 
(ponto-e-vírgula) - como em Python -, exceto em dois casos 
especiais: o for quando usado em estilo C (dois comandos + 
uma expressão lógica) e o case quando tiver apenas um 
comando (pode-se usar ponto-e-vírgula para separar o 
comando do break). Como conseqüência, exceto nos casos 
explicitados, cada linha de código deverá apresentar no 
máximo um comando. 
2. O delimitador de início de bloco (abre chaves) deve ser 
colocado ao final da estrutura que anuncia o bloco. 
3. O delimitador de fim de bloco (fecha chaves) deve aparecer 
sozinho na linha e no mesmo nível de indentação da linha 
de código que abriu o bloco. 
4. Não se deve utilizar espaços para indentação, apenas o 
caractere de tabulação (TAB). 
5. O código começa alinhado à esquerda, não sendo 
necessário usar uma tabulação para o nível inicial do 
arquivo js. 
6. Deve-se evitar o uso de linhas em branco no código. 
Quando necessárias para organização, certifique-se de não 
haver caracteres brancos (tabulações e espaços) na linha. 
7. Blocos formados por uma só linha de código não precisarão 
de delimitadores de início e fim, somente da indentação. 
function exemplo(){
 for(i =0; i <10; i++)
 alert('(' +i +') Este é o 
exemplo da identação')
 alert('O exemplo da identação foi 
rodado ' +i +' vezes.')
}
Expressões
1. Qualquer operador (matemático, lógico, de atribuição) deve 
ser escrito com um espaço antes (entre o operador e o 
primeiro operando) e nenhum depois (deve estar unido ao 
segundo operando). 
2. Variáveis incrementadas/decrementadas devem aparecer 
com o operador próximo a elas e separadas das demais da 
expressão (e demais operadores) por espaços (antes e 
depois, mas nunca acumulados com outros espaços que a 
expressão já traga próximo ao [in|de]cremento). 
3. Expressões que demandem parênteses e chaves (tais como 
o if, o while ou mesmo o function) não apresentarão 
espaços na concatenação com parênteses e com chaves. 
4. Encadeamentos de comandos separados por ponto-e-
vírgula devem ter um espaço após cada ponto-e-vírgula. 
5. Listas separadas por vírgula não devem apresentar espaços 
entre seus ítens e as vírgulas. 
Esta é a forma proposta pelo padrão:
x =y *2 +3 /z
Aqui temos um caso se atribuição seletiva (lógica de circuitos):
aux =x ||y ||20
Outro exemplo maior:
function somaInteiros(a,b){
 s ='A soma de ' +a +' com ' +b +' 
retornou '
 while(b >0){
 a++
 b--
 }
 while(b <0){
 a--
 b++
 }
 return s +a +'.'
}
Note que o único espaço na primeira linha é o que se encontra 
depois de function.
Concatenação de strings (a e b são convertidos em strings 
automaticamente): colocar um espaço antes de cada sinal de 
concatenação.
Comentários
Evite colocar comentários no código. Tente fazer o código da 
maneira mais clara e auto-explicativa possível, colocando apenas 
comentário essenciais (como, por exemplo, o cabeçalho do arquivo, 
onde deve haver uma nota da licença de distribuição).
Iara JavaScript Code Standards #15
Manual JavaScript
Nomenclatura
1. Nomes devem ser escritos em inglês, hábito considerado 
boa prática de programação. Um software não está preso a 
nenhuma cultura específica, não sendo cultural, mas uma 
forma internacional de resolver problemas. Por isso, 
escrever código com nomes em inglês não é falta de 
patriotismo; 
2. Nomes são essencialmente em caracteres minúsculos, 
exceto nos casos tratados nos próximos ítens; 
3. Nomes de classes começam sempre com a primeira letra em 
maiúsculo, a menos que seja uma classe de uma API. Neste 
caso, a API deve fornecer uma sub-string padrão, que 
deverá estar no início dos nomes de todas as classes da 
API. Esta sub-string pode ter letras maiúsculas e 
minúsculas livremente; 
4. Sempre que o nome tiver mais que uma palavra o 
formando, cada palavra depois da primeira (que segue as 
regras apresentadas acima) deve ser unida ao restante, 
mudando-se apenas a primeira letra para maiúscula. Nunca 
utilizar sublinhados para essas uniões. 
5. Nomes de atributos e métodos privados deverão ter um 
caractere “_” no início. Isso não os torna praticamente 
privados, mas conceitualmente, entre nós programadores. 
Uma solução similar é utilizada em Perl 5, que também não 
traz o conceito de método privado. 
6. Deve-se evitar abreviações. 
Exemplificando...
completeTable =new ADSTable()
O exemplo acima mostra um objeto completeTable sendo 
criado a partir da classe ADSTable.
O objeto é formado pelo nome “Complete Table”. Começando 
com minúscula por ser objeto, temos “complete Table”. Como é dito, 
cada palavra além da primeira deve ser unida ao resto, com a 
primeira letra em maiúscula. Por isso, “Table” se une ao “complete”, 
mantendo o “T” maiúsculo: “completeTable”.
A classe apresentada é a implementação de tabela de uma 
suposta API que adotou a sub-string "ADS" para definir suas classes. 
Por isso a classe tem esse nome: ”ADS” + “Table”.
Variáveis
1. Constitui-se uma boa prática de programação a declaração 
de variáveis. Entretanto, não havemos de declarar uma 
variável por questões de tamanho do arquivo gerado (var). 
Outras linguagens amplamente conhecidas não oferecem 
forma de se declarar variáveis (PHP 4) ou a oferecem como 
opcional (Perl 5 em modo normal). Portanto, 
consideraremos a declaração de uma variável como um 
hábito não-primordial para a boa apresentação do código, 
abolindo-a. 
2. Uma variável deve ser sempre inicializada com um valor 
explícito, de uma outra variável ou retorno de uma função. 
Não se deve utilizar qualquer operadorque aja sobre a 
variável sem que esta tenha recebido um valor inicial. Tal 
deve ser feito, preferencial mas não necessariamente, no 
início do bloco de código. 
3. Vetores devem ser declarados com “[]” e não com “new 
Array()”. 
4. Valores booleanos devem ser expressos como true ou false 
sempre que houver risco de valores numéricos causarem 
confusões. O ideal, entretanto, é que se utilize sempre 0 e 1, 
como em C. 
Classes
1. Métodos devem ser declarados dentro da própria classe. 
2. Herança deve ser feita através do processo de refazer o 
construtor a partir do construtor da classe mãe: cria-se um 
método make pela atribuição do construtor da classe mãe e 
invoca-se tal método logo em seguida. 
3. No caso de herança múltipla, o método terá o mesmo nome, 
mas os dois passos serão seguidos mais de uma vez, sempre 
em par. 
Vejamos, por exemplo, a classe ADSCode.
function ADSCode(s){
 this.content =s ||''
 this.add =function(s){
 this.content +=s
 }
 this.obtain =function(){
 return this.content
 }
 this.write =function(){
 document.write(this.obtai
n())
 }
}
É desta forma que todos os métodos são definidos dentro da 
classe. Veja add, obtain e write.
Agora suponha uma classe ADSParagraph, apenas para 
exemplificar (usando [p] para a tag de parágrafo, apenas para 
simplificar a edição aqui, na web).
function ADSParagraph(s){
 this.make =ADSCode
 this.make(s)
 this.obtain =function(){
 return '[p]' 
+this.content+ '[/p]'
 }
}
As duas linhas que começam com this.make fazem com 
que o ADSParagraph herde todo o comportamento e estado inicial de 
ADSCode.
No exemplo, sobrescrevemos o método obtain, perdendo o 
herdado de ADSCode.
Iara JavaScript Code Standards #16
	Introdução
	História
	Altos e Baixos
	O Que Ela É
	Sobre Este Manual
	Conhecimento Prévio
	Software Necessário
	Programando Estruturadamente
	Tipos de Variáveis
	Operadores
	Listas
	Estrutura Básica
	Estruturas de Repetição
	while
	do-while
	for
	Estruturas de Decisão
	if
	switch
	if condensado
	Modularização
	Sobre Parâmetros
	Programando com Orientação a Objetos
	Antes de Começar
	Orientação a Objetos
	Composição
	Classes
	Herança
	Usando Objetos
	Estrutura with
	A Criação de Classes
	Classe Data
	Composição
	Herança
	Iara JavaScript Code Standards
	Indentação
	Expressões
	Comentários
	Nomenclatura
	Variáveis
	Classes