JAVASCRIPT Programao Web O que E uma linguagem
![JAVASCRIPT Programação Web JAVASCRIPT Programação Web](https://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-1.jpg)
JAVASCRIPT Programação Web
![O que é E uma linguagem interpretada que e executada na maquina do cliente O que é E uma linguagem interpretada que e executada na maquina do cliente](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-2.jpg)
O que é E uma linguagem interpretada que e executada na maquina do cliente Não esta associada ao framework java Não consegue acessar recursos da maquina do cliente.
![O que é Utilizada para validação de formulários Para interações locais com o cliente O que é Utilizada para validação de formulários Para interações locais com o cliente](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-3.jpg)
O que é Utilizada para validação de formulários Para interações locais com o cliente Para controles de navegação Aplicada nas mais variadas tecnologia de script: HTM, ASP. NET, JSP , PHP e etc
![Caracteristicas Case Sensitive – diferencia letras maiusculas de minusculas Toda linha termina com um Caracteristicas Case Sensitive – diferencia letras maiusculas de minusculas Toda linha termina com um](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-4.jpg)
Caracteristicas Case Sensitive – diferencia letras maiusculas de minusculas Toda linha termina com um ponto e virgula exceto bloco de comandos
![Tag <script language=“javascript”> </script> Tag <script language=“javascript”> </script>](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-5.jpg)
Tag <script language=“javascript”> </script>
![Mensagem <script language=“javascript”> //mensagem simples informativa alert(“minha mensagem”); // mensagem de escolha var opc=confirm(“continuar Mensagem <script language=“javascript”> //mensagem simples informativa alert(“minha mensagem”); // mensagem de escolha var opc=confirm(“continuar](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-6.jpg)
Mensagem <script language=“javascript”> //mensagem simples informativa alert(“minha mensagem”); // mensagem de escolha var opc=confirm(“continuar ? ”); </script>
![Criando Variáveis <script language=“javascript”> var nome = “maria”; var nota 1 = 8. 5; Criando Variáveis <script language=“javascript”> var nome = “maria”; var nota 1 = 8. 5;](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-7.jpg)
Criando Variáveis <script language=“javascript”> var nome = “maria”; var nota 1 = 8. 5; </script>
![Convertendo Tipos <script language=“javascript”> //convertendo para inteiros var nota 1 = parse. Int(campo 1. Convertendo Tipos <script language=“javascript”> //convertendo para inteiros var nota 1 = parse. Int(campo 1.](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-8.jpg)
Convertendo Tipos <script language=“javascript”> //convertendo para inteiros var nota 1 = parse. Int(campo 1. value); //convertendo para string var nome =parse. String(78. 5); </script>
![Convertendo Tipos <script language=“javascript”> //convertendo para decimais var nota 1= parse. Float(campo 1. value); Convertendo Tipos <script language=“javascript”> //convertendo para decimais var nota 1= parse. Float(campo 1. value);](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-9.jpg)
Convertendo Tipos <script language=“javascript”> //convertendo para decimais var nota 1= parse. Float(campo 1. value); </script>
![Operador de associação Var teste = “ABCD”; Operador de associação Var teste = “ABCD”;](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-10.jpg)
Operador de associação Var teste = “ABCD”;
![Operadores Aritméticos + Soma - subtração / divisão * multiplicação () parenteses % modulo Operadores Aritméticos + Soma - subtração / divisão * multiplicação () parenteses % modulo](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-11.jpg)
Operadores Aritméticos + Soma - subtração / divisão * multiplicação () parenteses % modulo (resto da divisão)
![Acessando objetos htm Para acessar um objeto htm e utilizado atraves do ID do Acessando objetos htm Para acessar um objeto htm e utilizado atraves do ID do](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-12.jpg)
Acessando objetos htm Para acessar um objeto htm e utilizado atraves do ID do objeto exemplo: <input type="text" id="campo 1” value="5. 5"> <script language="javascript"> var nota 1 = parse. Float(campo 1. value); </script>
![Funções <script language=“javascript”> function calculadora(n 1, n 2 , op) { return valor; } Funções <script language=“javascript”> function calculadora(n 1, n 2 , op) { return valor; }](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-13.jpg)
Funções <script language=“javascript”> function calculadora(n 1, n 2 , op) { return valor; } </script>
![Funções <html><body> <input type="text" id="campo 1" value="0"> <input type="text" id="campo 2" value="0"> <input type="text" Funções <html><body> <input type="text" id="campo 1" value="0"> <input type="text" id="campo 2" value="0"> <input type="text"](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-14.jpg)
Funções <html><body> <input type="text" id="campo 1" value="0"> <input type="text" id="campo 2" value="0"> <input type="text" id="campo 3" value="0"> <input type="button" value="somar" on. Click="Testar(); "> </body></html> <script language="javascript"> function Testar(){ var nota 1 = parse. Float(campo 1. value); var nota 2 = parse. Float(campo 2. value); campo 3. value = somar(nota 1, nota 2); } function somar(n 1, n 2){ var resultado = n 1 + n 2; return resultado; } </script>
![Funções São blocos de comandos que serão reutilizados Podem ser evocadas através do próprio Funções São blocos de comandos que serão reutilizados Podem ser evocadas através do próprio](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-15.jpg)
Funções São blocos de comandos que serão reutilizados Podem ser evocadas através do próprio js e de eventos de objetos da tela. Não é obrigatório a lista de parâmetros e o return
![Eventos são ações interativas da tela on. Click – ao clicar o objeto on. Eventos são ações interativas da tela on. Click – ao clicar o objeto on.](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-16.jpg)
Eventos são ações interativas da tela on. Click – ao clicar o objeto on. Change – ao alterar algum valor on. Focus – quando objeto esta selecionado on. Mouse. Over – quando o mouse esta em cima do objeto on. Mouse. Out – quando o mouse sai de cima do objeto on. Key. Up – quando uma tecla e pressionada e solta on. Load – quando a pagina e carregada
![Expressão Lógica Uma expressão lógica e o comparativo de duas partes o qual vai Expressão Lógica Uma expressão lógica e o comparativo de duas partes o qual vai](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-17.jpg)
Expressão Lógica Uma expressão lógica e o comparativo de duas partes o qual vai retorna um tipo lógico (Verdadeiro ou Falso). Os operadores relacionais são utilizados para comparar variáveis, constantes e valores entre si.
![Operadores Relacionais == Igualdade != Diferente > maior >= maior igual < menor <= Operadores Relacionais == Igualdade != Diferente > maior >= maior igual < menor <=](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-18.jpg)
Operadores Relacionais == Igualdade != Diferente > maior >= maior igual < menor <= menor igual Exe: A=10, B=5 A>B => V , B>=A => F , A==B => F
![Operadores Lógicos Quando existe 2 a N condições lógicos e necessário utilizar os operadores Operadores Lógicos Quando existe 2 a N condições lógicos e necessário utilizar os operadores](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-19.jpg)
Operadores Lógicos Quando existe 2 a N condições lógicos e necessário utilizar os operadores lógicos para obter um resultado da expressão && - E || - OU ! – NÃO Exe: A= 3 , B=5, C=8 A>B && B<=C => F && V => F
![Comando de Condição IF If( a >= b) { //caso verdadeiro } else { Comando de Condição IF If( a >= b) { //caso verdadeiro } else {](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-20.jpg)
Comando de Condição IF If( a >= b) { //caso verdadeiro } else { //caso falso }
![Comando de Condição IF if(nome. value == “”){ alert(“informe o nome !”) nome. focus(); Comando de Condição IF if(nome. value == “”){ alert(“informe o nome !”) nome. focus();](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-21.jpg)
Comando de Condição IF if(nome. value == “”){ alert(“informe o nome !”) nome. focus(); return false; } else { return true; }
![Comando de Condição IF if(nome. value. length <= 3){ alert(“digite um nome com mais Comando de Condição IF if(nome. value. length <= 3){ alert(“digite um nome com mais](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-22.jpg)
Comando de Condição IF if(nome. value. length <= 3){ alert(“digite um nome com mais de 3 caracteres!”); nome. focus(); return false; }
![Comando de Repetição Enquanto Faça (0. . . N) while(<codição>) { //bloco de comandos Comando de Repetição Enquanto Faça (0. . . N) while(<codição>) { //bloco de comandos](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-23.jpg)
Comando de Repetição Enquanto Faça (0. . . N) while(<codição>) { //bloco de comandos } Faça Enquanto(1. . . N) do{ //bloco de comandos }while(<codição>);
![Comando de Repetição Faça Ate(X. . . Y) for(i=0; i <10 ; i++){ //bloco Comando de Repetição Faça Ate(X. . . Y) for(i=0; i <10 ; i++){ //bloco](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-24.jpg)
Comando de Repetição Faça Ate(X. . . Y) for(i=0; i <10 ; i++){ //bloco de comandos } Aonde int i=1 => iniciando contador i < 10 => condição logica do contador i++ => formato de incremento
![Comando de Repetição Exemplo: var total = 0; For(i = 0; i < caixa. Comando de Repetição Exemplo: var total = 0; For(i = 0; i < caixa.](http://slidetodoc.com/presentation_image_h2/c96711ea8774bbb7a7c21917baac48bd/image-25.jpg)
Comando de Repetição Exemplo: var total = 0; For(i = 0; i < caixa. length; i++){ total = total + parse. Int(caixa[i]. value); }
- Slides: 25