Módulo 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

1,918 views

Published on

Curso Técnico de Gestão e Programação de Sistema Informáticos, ano lectivo 2010/2011.

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,918
On SlideShare
0
From Embeds
0
Number of Embeds
159
Actions
Shares
0
Downloads
48
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Módulo 5 – Desenvolvimento de Páginas Web Dinâmicas: Javascript

  1. 1. M5<br />JAVASCRIPT<br />Agrupamento de EscolasdaBatalha<br />MiguelaFernandes<br />Janeiro 2011<br />
  2. 2. Sumário<br />Iremos abordar:<br /><ul><li> Variáveis
  3. 3. Constantes
  4. 4. Janelas de mensagens
  5. 5. Operadores
  6. 6. Caracteres especiais
  7. 7. Funções
  8. 8. Exemplo prático</li></ul>MF.<br />2<br />
  9. 9. Variáveis (1)<br />As variáveis são usadas para guardar valores. No Javascript não há necessidade de definir um tipo. <br />As variáveispodemconterqualquer valor, taiscomo: números, strings, valoresbooleanosouobjectos. Exemplos:<br />Idade=15;<br />Nome=“MF”;<br />Adivinha=“124”;<br />MF.<br />3<br />
  10. 10. Variáveis (2)<br />As variáveis podem ser Locais ou Globais:<br />Locais: são criadas dentro de uma função e existem apenas dentro da função. <br />Globais: são criadas fora das funções e existem em qualquer parte do código. <br />var x=2;<br />vary=“2”;<br />MF.<br />4<br />
  11. 11. Constantes<br />São variáveis que assumem um valor fixo. Usa-se habitualmente maiúscula, tal como no C. Exemplo: <br />const ERR_INVALID_USERID;<br />const ERR_INVALID_USERID = 300;<br /> ERR_INVALID_USERID = 300;<br />MF.<br />5<br />
  12. 12. Arrays<br />var ar = newArray(20); //declara um array<br />varnomes=[“joão”, “joana”, “marco”]<br />ar[0]=10;<br />ar[1]=“ok”;<br />MF.<br />6<br />
  13. 13. Arrays : exemplo<br />var ar = newArray(10); <br />//declara um array<br />for (var i=0; i <= ar.length; i++){<br />document.writeln(“ar["+i+"]= " + ar[i])<br />}<br />MF.<br />7<br />
  14. 14. Janelas de mensagens (1)<br />O JavaScript permiteutilizar 3 tipos de janelas de mensagensnaspáginas web:<br />Mensagem de alerta<br />Mensagem de confirmação<br />Mensagem de input<br />MF.<br />8<br />
  15. 15. Janelas de mensagens: alerta<br />As janelas de mensegemsãodefinidas com funções. Exemplo:<br />alert(‘Oláaquiestamosnós com o javascript’);<br />MF.<br />9<br />
  16. 16. Janelas de mensagens: confirmação<br />Janela de mensagem que retorna confirmação de OK ou CANCELAR <br />A variávelresultadovaiconter um resultadoverdadeiro de clicar no OK e falsocasoseja no cancelar.<br />resultado= confirm (‘Estás a gostar do Javascript’);<br />MF.<br />10<br />
  17. 17. Janelas de mensagens: input<br />Esta janela recebe uma mensagem através da caixa de texto Input.<br />A variávelresultadovaiconter um resultado do tipo string.<br />resultado= prompt("Qual o teu nome?","Escreve a tua mensagem");<br />MF.<br />11<br />
  18. 18. Operadores (1)<br />MF.<br />12<br />
  19. 19. Operadores (2)<br />MF.<br />13<br />Logicos<br /> ||, &&, !, >, <, !=, ==, ?:, >=, <=<br />Computacionais <br /> +,-,*,/, ++, --, %<br />Bitwise<br /> ~, >>, <<, &, ^, |<br />Atribuicao<br /> =, +=, -=, /=, *=, etc.<br />
  20. 20. Funções (1)<br />MF.<br />14<br />Uma função tem um conjunto de instruções, que só devem ser executadas quando a função for chamada. Deverão ser definidas no cabeçalho, preferencialmente. A sintaxe é: <br />functionNomeFunção (Parâmetros) <br /> { instruções;<br /> }<br />
  21. 21. Caracteres especiais<br />b- backspace<br />n- newlinecaracters<br />r- carriagereturn<br />t- tabcaracters<br />// - Linha de comentário<br />/*....*/ - Comentário com mais do que uma linha. <br />“ ou ‘ – delimitadores para uma string. Caso seja necessário a sua utilização como parte da string, utiliza antes do " ou ‘. Exemplo:<br />alert (“Vou usar as" e a ’"); <br />MF.<br />15<br />
  22. 22. Funções (2)<br />MF.<br />16<br /><html><head><script type="text/javascript">function mensagem(){alert(“A minha primeira função ;-)!");}</script></head><body><form> <input type="button" value=“Clica aqui!" onclick=“mensagem()" /></form></body></html><br />
  23. 23. Exercício prático<br />Escreve uma função que calcule a soma de 2 números digitados pelo utilizador. <br />MF.<br />17<br />
  24. 24. Exercício prático<br />Escreve uma função que tem como objectivo informar se uma pessoa é maior ou menor de idade, recebendo como parâmetro a sua idade. <br />function Idade (Anos) <br />{ <br />if (Anos > 17) { <br />alert ("Maior de Idade") } <br />else { <br />alert ("menor de Idade") } <br />}<br />MF.<br />18<br />
  25. 25. Webgrafia e Bibliografia<br />http://www.w3schools.com/JS/<br />http://javascript.internet.com/<br />https://woc.ipca.pt/est/class/getmaterial.do?idclass=627&idyear=13<br />Teagu, J. C. (2004). DHTML and CSS for the World Wide Web (2ª Ed.). USA:Peachpit Press.<br />MF.<br />19<br />

×