Estude fácil! Tem muito documento disponível na Docsity
Ganhe pontos ajudando outros esrudantes ou compre um plano Premium
Prepare-se para as provas
Estude fácil! Tem muito documento disponível na Docsity
Prepare-se para as provas com trabalhos de outros alunos como você, aqui na Docsity
Encontra documentos específicos para os exames da tua universidade
Prepare-se com as videoaulas e exercícios resolvidos criados a partir da grade da sua Universidade
Responda perguntas de provas passadas e avalie sua preparação.
Ganhe pontos para baixar
Ganhe pontos ajudando outros esrudantes ou compre um plano Premium
Apostila básica sobre Javascript. Pra quem não entene nada é muito boa.
Tipologia: Notas de estudo
1 / 48
Esta página não é visível na pré-visualização
Não perca as partes importantes!
OBS: esta apostila foi montada com trechos retirados de vários sites da internet.
document.write("Aqui já é JavaScript");
Voltamos para o HTML
É importante ressaltar que todas as linhas devem ser terminadas com; (ponto e virgula) a menos que a próxima instrução seja um “else” e se você precisar escrever mais de uma linha para executar uma condição seja ela em uma estrutura “for”, “if” ou “while”, este bloco de instruções deve estar entre “{ }” (chaves). Inclusive a definição de funções segue este modelo, ou seja, todo o código da função deve estar limitado por { (no início) e } (no final).
Um browser que não suporta JavaScript, ele não conhece a TAG Voltamos para o HTML
Se o browser não suportar JavaScript e não inserirmos o comentário HTML, o que apareceria na tela seria:
Esta é uma linha escrita em HTML document.write("Aqui já é JavaScript"); Voltamos para o HTML
Note que esse artifício não esconde completamente o código JavaScript, o que ele faz é prevenir que o código seja mostrado por browsers mais antigos, porém o usuário tem acesso a todas as informações do código fonte de sua Home Page (tanto HTML, quanto JavaScript).
1.2) Variáveis
Em JavaScript, variáveis dinâmicas podem ser criadas e inicializadas sem declarações formais. Existem dois tipos de abrangência para as variáveis: “Global” - Declaradas/criadas fora de uma função. As variáveis globais podem ser acessadas em qualquer parte do programa. “Local” - Declaradas/criadas dentro de uma função. Só podem ser utilizadas dentro da função onde foram criadas e precisa ser definida com a instrução Var. Com relação à nomenclatura, as variáveis devem começar por uma letra ou pelo caractere sublinhado “ _” , o restante da definição do nome pode conter qualquer letra ou número. É importante ressaltar que a variável “Código” é diferente da variável “código” , que por sua vez é diferente de “CODIGO” , sendo assim, muito cuidado quando for definir o nome das variáveis, utilize sempre um mesmo padrão. Existem três tipos de variáveis: Numéricas , Booleanas e Strings. Como já era de se esperar, as variáveis numéricas são assim chamadas, pois armazenam números, as Booleanas valores lógicos (True/False) e as Strings, seqüência de caracteres. As strings podem ser delimitadas por aspas simples ou duplas, a única restrição é que se a delimitação começar com as aspas simples, deve terminar com aspas simples, da mesma forma para as aspas duplas. Podem ser incluídos dentro de uma string alguns caracteres especiais, a saber: \t - posiciona o texto a seguir, na próxima tabulação; \n - passa para outra linha; \f - form feed; \b - back space; \r - carrige return.
O JavaScript reconhece ainda um outro tipo de contudo em variáveis, que é o NULL. Na prática isso é utilizado para a manipulação de variáveis não inicializadas sem que ocorra um erro no seu programa. Quando uma variável possui o valor NULL , significa dizer que ela possui um valor desconhecido ou nulo. A representação literal para NULL é a string 'null' sem os delimitadores. Quando referenciado por uma função ou comando de tela, será assim que NULL será representado. Observe que NULL é uma palavra reservada.
Multiplicação ( * ) Exemplo: V01= V02= V=V01*V02 // resulta em: 10 Divisão ( / ) Exemplo: V01= V02= V=V01/V02 // resulta em: 2. Módulo da divisão ou resto ( % ) Exemplo: V01= V02= V=V01%V02 // resulta em: 1 Incremento ( ++ ) Pode acontecer de duas formas: ++Variável ou Variável++ Exemplo: V01 = 5 V02 = ++V01 // Resulta em 6 V03 = V01 // Resulta em 6 Exemplo: V01 = 5 V02 = V01++ // Resulta em 5 V03 = V01 // Resulta em 6 Decremento ( -- ): Pode acontecer de duas formas: --Variável ou Variável-- Exemplo: V01 = 5 V02 = --V01 // Resulta em 4 V03 = V01 // Resulta em 4 Exemplo: V01 = 5 V02 = V01-- // Resulta em 5 V03 = V01 // Resulta em 4
1.3.4) Operadores relacionais
< Menor que > Maior que = = Igual != Diferente >= Maior ou igual <= Menor ou igual
1.3.5) Operadores lógicos
&& E lógico || Ou lógico
1.3.6) Operadores de atribuição
= Atribuir += Soma ou concatenação e atribuição: x+=5 // é o mesmo que: x=x+ -= Subtração e atribuição. x-=5 // é o mesmo que: x=x- = Multiplicação e atribuição. x=5 // é o mesmo que: x=x* /= Divisão e atribuição. x/=5 // é o mesmo que: x=x/ %= Módulo e atribuição. x%=5 // é o mesmo que: x=x%
Maria.renda - retorna 1300
Uma outra forma de referenciar as propriedades do objeto Maria, é: Maria[0], Maria[1], Maria[2], Maria[3]
Uma forma mais prática de criar arrays poderia ser a seguinte:
Function Matriz(n) { this.length=n for (var contador=1 ; contador <=n ; conatdor=contador+1) { this[contador]="" } }
Para criar nossa matriz usaríamos o seguinte comando: Mes=Matriz(12)
O próximo passo seria apenas incluir os dados: Mes[1] = 'Janeiro' Mes[2]='Fevereiro' ... Mes[12]='Dezembro'
Podemos também utilizar os dois métodos ao mesmo tempo!
Clientes=New Matriz(3) Clientes[1]=New CriaClientes("Charlene","Rua A, 51","331-0376",1150) Clientes[2]=New CriaClientes("José","Rua das Avencas, S/N","332-2781",950) Clientes[3]=New CriaClientes("Joaquim Manoel", "Rua Amancio Pinto, 171", ,1000)
Teríamos agora: Clientes[1].nome = "Charlene"; Clientes[2].telefone="332-2781" Clientes[3].telefone=null
Além das estruturas de controle, o JavaScript oferece alguns poucos comandos: Break Continue Var With Function Return Comment
3.1) VAR
Em JavaScript, nem sempre é necessário definir uma variável antes de utilizá-la, é o que ocorre com variáveis globais, porém, é importante ressaltar que a utilização da instrução “var” , a nível de documentação é muito bem-vinda. Já nas definições de variáveis locais, é obrigatório a utilização da instrução var.
Você pode armazenar um valor na própria linha de definição da variável, se não o fizer, para o JavaScript, esta variável possui um valor desconhecido ou nulo.
Não é obrigatória a utilização de uma instrução “var” para cada variável declarada, na medida do possível, você pode declarar várias variáveis em uma só instrução var.
Var NomeDaVariável [ = ];
Var Contador = 0; Var Inic="",Tolls=0,Name="TWR"; Var Teste; // Neste caso, Teste possui valor null
document.write(x) // resulta: 5
3.4) Continue
Pode ser executado somente dentro de loops “for” ... ou “while” ... e tem por objetivo o cancelamento da execução do bloco de comandos passando para o início do loop. Forma geral: Continue Exemplo: Neste exemplo, serão impressos os números de 1 a 10, com exceção do número 5, ou seja, quando a variável “x” atinge o valor 5 a execução do bloco de comandos é interrompida e o controle retorna ao início do loop, onde a variável “x” será incrementada. For (var x=1 ; x < 10 ; x++) { If (x = = 5) { continue } document.write(x) }
3.5) Funções
As funções podem ser definidas como um conjunto de instruções, agrupadas para executar uma determinada tarefa. Dentro de uma função pode existir uma chamada a outra função. Para as funções podem ser passadas informações, as quais são chamadas de parâmetros. As funções podem ou não retornar alguma informação, o que é feito com o comando Return. A definição de uma função é feita da seguinte forma:
Function NomeDaFunção([ parametro1, parametro2, ..., parametroN ]) { ... [Return(ValorDeRetorno)] } A chamada de funções é feita da seguite forma: NomeDaFunção([parâmetros]) Funções são melhor declaradas entre as tags __ de sua página HTML. Funções são frequentemente chamadas por eventos acionados pelo usuário. Assim parece razoável colocar as funções entre as tags . Elas são carregadas antes que o usuário faça alguma coisa que possa chamar uma função.
...
...
! "$#&%' (#)*)+ ,.-(/ 01- 2 $43 )5,76 84,95/$:);5;6 6 , #$/<)5,=>. ?/$ @BA0/$ C"$#7 " # !#.6 ,DE$ 8$F,-;G 8,.) 8H
3.6) Comentários
Comentários podem ser formulados de varias maneiras, dependendo do efeito que você precisa. Para comentários longos de várias linhas, ou blocos de comentários, use: _/_* O barra-asterisco inicia um bloco de comentário que pode conter quantas linhas você precisar todo o texto após o barra asterisco é ignorado, até que asterisco-barra seja encontrado, terminando assim o bloco de comentário _/_*
Para comentários de uma linha, use barra dupla ( // ) para introduzir o comentário. Todo o texto seguindo este simbolo até o próximo carrige-return será considerado um comentário e ignorado para fins de processamento. Exemplo: // este texto será tratado como comentário
Os códigos JavaScript podem ser colocados em campos de comentário de modo que browsers antigos não mostrem o próprio código JavaScript, como vemos a seguir:
3.7.2) For...In
Este comando tem por objetivo, procurar a ocorrência de uma variável, dentro das propriedades de um objeto, ao encontrar a referida variável, um bloco de comandos pode ser executado.
Forma geral: For (variavel In objeto) { bloco de comandos } Exemplo: Esta função procura por uma propriedade do Objeto , cujo o nome esteja especificado pela variável Procura , onde Nome é uma string correspondendo ao nome do objeto.
Function SearchIn(Procura,Objeto,Nome) { Var ResultadoDaBusca = "" For (Procura In Objeto) { document.write(Nome+"."+Procura+"="+Objeto[Procura]+""); } }
3.7.3) If...Else...
A estrutura If ... executa uma porção de código se a condição especificada for verdadeira. A estrutura pode também ser especificada com código alternativo para ser executado se a condição for falsa. Function VerificaIdade(anos) { If anos >= 16 { Return ('Já pode votar!') } else { Return (' Ainda é muito cedo para votar...') } }
Uma alternativa para economizar If 's seria a utilização de uma expressão condicional, que funciona para situações mais simples, o exemplo acima ficaria da seguinte forma:
VariavelDeRetorno= (anos>=16)? 'Já pode votar!' : 'Ainda é muito cedo para votar...'
3.7.5) While
Outro tipo de loop é aquele baseado numa condição ao invés de no número de repetições. Por exemplo, suponha que você necessita que um determinado processo seja repetido até que um determinado teste dê um resultado verdadeiro ou seja executada a instrução Break.
Forma geral: while () { Corpo da Estrutura }
No exemplo abaixo, o bloco de instruções será executado 10 vezes, pois a variável Contador é inicializada com o valor 1 e o bloco de instruções será executado enquanto Contador for menor que 11. A cada execução do bloco de instruções Contador é incrementado. Var Contador=1; While ( Contador < 11 ) { document.write(Contador++) ;}
prompt - Monta uma caixa de entrada de dados, de forma simplificada comparando-se com o objeto text. Ex: prompt(label [,valor]) onde: label - texto que aparece ao lado da caixa. valor - é o conteúdo inicial da caixa.
JavaScript organiza todos os elementos de uma Home Page dentro de uma hierarquia. Cada elemento é visto como um objeto. Os objetos podem ter propriedades, métodos e responder a certos eventos. Por isso é muito importante entender a hierarquia dos objetos HTML. Você entenderá rapidamente como isto funciona com a ajuda de um exemplo. O exemplo seguinte é uma página HTML simples:
No exemplo acima, nós temos, um link , duas imagens, e um formulário com dois campos texto e dois botões. Do ponto de vista do JavaScript a janela do browser é um objeto window , que contém certos elementos, como a barra de status.
Dentro da janela, nós podemos carregar uma página HTML. Esta página é um objeto document. Desta forma o objeto document representa o documento HTML (que está carregado no momento). O objeto document é muito importante, em JavaScript você sempre o usará muito. As propriedades e métodos do objeto document serão vistas detalhadamente, mais adiante.
