Internet Profª Rita de Cassia Gaieski [email protected] Aula 11 Introdução ao Java Script Java Script é uma linguagem que permite trabalhar com a Lógica em páginas escritas em HTML (HiperText Mark-up Language). As páginas HTML podem ser escritas utilizando-se editores de texto como por exemplo o NotePad++. Foi criada em 1995 através de um consórcio entre a Netscape e a Sun, com a ideia de popularizar a linguagem Java, embora são muito parecidas, sua principal relação é devido a sua origem, pois ambas veem das Linguagens C e C++. Atualmente é a linguagem para a Web mais popular, sendo utilizada em milhões de páginas como uma forma de melhorar a interação com o usuário, detectar o navegador ou a necessidade de recursos especiais na máquina do usuário, validação e preenchimento de formulários, entre outras aplicações. Tag de utilização Histórico e Tabela de Versões A linguagem Java Script foi desenvolvida para rodar no lado do cliente, ou seja, sua a interpretação e seu funcionamento dependem de funcionalidades hospedadas no navegador do usuário. Isso acontece pois existe um interpretador Java Script hospedado no navegador. Brendan Eich, da Netscape, foi o responsável por criar o Java Script e a primeira versão da linguagem denominada JavaScript 1.0 foi introduzida no navegador Netscape 2.0 em 1996. Nesse mesmo ano, a Microsoft lançou sua versão com o nome JScript 1.0 e introduziu-a no então Internet Explorer 3.0, em plena guerra dos navegadores, as Internet Profª Rita de Cassia Gaieski [email protected] diferentes implementações das funcionalidades da linguagem nos dois navegadores não seguiam um padrão unificado, causando um verdadeiro martírio para o desenvolvedor implantar scripts para servir ambos os navegadores. Internet Profª Rita de Cassia Gaieski [email protected] HTML X Java Script O código fonte Java Script é incluído no próprio arquivo HTML. Com o Java Script, podemos escrever marcação HTML e inseri-la na marcação de um documento existente. Por exemplo: inserção de data/hora no documento, inserção de uma mensagem de boasvindas ou, ainda, inserção de conteúdos diferenciados e escolhidos de acordo com o navegador do usuário. Java Script é capaz de definir, alterar e controlar de forma dinâmica a apresentação de um documento HTML, como os aspectos relacionados à cor de fundo, de textos e de links, ou mesmo interferir no posicionamento dos elementos HTML de um documento. É possível também manipular a folha de estilos associada ao documento criando novas regras CSS ou anulando regras existentes. Orientação a Objetos Diferente da Linguagem HTML, a linguagem Java Script corresponde a programação orientada a objetos, isto significa que todos os elementos de uma página da Web são tratados como objetos. Estes objetos são agrupados de acordo com seu tipo ou finalidade. Dentro da linguagem Java Script, são criados automaticamente Objetos que permitem que o usuário possa criar novos objetos de acordo com sua conveniência. Ao ser carregada uma página da Web, é criado um determinado número de objetos Java Script, com propriedades e valores próprios que são ajustados pelo conteúdo da própria página. Todos eles seguem uma hierarquia que reflete toda a estrutura de uma página HMTL. A linguagem Java Script pode ser utilizada para a criação de scripts tanto do lado cliente como do lado servidor. Seguindo a hierarquia de objetos da linguagem Java Script, são criados os seguintes objetos ao ser carregada uma página: Window: é um dos objetos mais importantes na hierarquia dos objetos, contém todas as propriedades que se aplicam a toda a janela. Há também um objeto desta classe para todas as sub-janelas de um documentos com frames. Location: contém as propriedades da URL atual. History: contém as propriedades da URL visitadas. Document: contém as propriedades do documento contido na janela. Internet Profª Rita de Cassia Gaieski [email protected] Regras e Sintaxe do Java Script Para escrever códigos em Java Script não há necessidade de outros softwares mais eficientes, basta escrever no mesmo editor utilizado para escrever a sintaxe do HTML, porém vale lembrar que todo arquivo em Java Script deverá ser salvo na extensão .js e são criados e executados dentro de um arquivo HTML. Existem três maneiras de inserir a formatação utilizando JS. Inline: inserimos o script dentro da seção <body>, porém não é recomendada de acordo com o princípio da separação das camadas de desenvolvimento, pois dificulta em uma manutenção futura no código. Exemplo: Criando um link que ao ser clicado redireciona o usuário para outra página. Incorporado: inserimos o script na seção <head> do documento. É uma formatação que será utilizada apenas no documento em questão. Exemplo: Arquivo externo .js: inserimos as formatações da página em um arquivo externo salvo na extensão .js que será chamado dentro do arquivo HTML. Exemplo: Internet Profª Rita de Cassia Gaieski [email protected] Criando variáveis e constantes Uma das observações importantes do JS é sua escrita, pois ele adota uma regra de nomenclatura que é a (case sensitive), ou seja, para nomes de variáveis e funções é necessário respeitar a sua escrita de acordo com as letras maiúsculas e minúsculas. Armazenando valores variáveis: podem ser alteradas posteriormente. Armazenando valores constantes: seu valor não pode ser alterado. Em alguns navegadores como por exemplo IE: use apenas variáveis, pois o mesmo não reconhece constantes. Exemplo: Criando variáveis. Comentários de linha e bloco Comentários, são textos que o desenvolvedor pode inserir no código para facilitar o entendimento e a manutenção no script. Finalizando linhas de comandos Uso do ponto e vírgula ao final de cada linha. Internet Profª Rita de Cassia Gaieski [email protected] Iniciando e finalizando linhas de comandos, funções e métodos Uso de um par de chaves. Operadores Matemáticos: São operadores utilizados em cálculos, referências de indexadores e manuseio de Strings. Operador Função + Adição de valor e concatenação de Strings - Subtração de valores * Multiplicação de valores / Divisão de valores % Obtém o resto de uma divisão Operadores de Atribuição: São operadores que atribuem valores a outras variáveis no JS. Operador Função Exemplo += A += B: A = A+B *= Concatena /adiciona ao String/valor já existente São utilizados da mesma forma do operador anterior, mudando apenas o sinal. - /= %= - -= A -= B: A = A - B A*= B: A = A* B A/= B: A = A/ B A%= B: A = A % B