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