LabMM3 - Aula teórica 04
Upcoming SlideShare
Loading in...5
×
 

LabMM3 - Aula teórica 04

on

  • 1,242 views

 

Statistics

Views

Total Views
1,242
Views on SlideShare
1,237
Embed Views
5

Actions

Likes
0
Downloads
96
Comments
0

1 Embed 5

http://paper.li 5

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

LabMM3 - Aula teórica 04 LabMM3 - Aula teórica 04 Presentation Transcript

  • JavaScriptCarlos SantosLabMM 3 - NTC - DeCA - UAAula 04, 22-09-2011
  • O que é?• Linguagem de programação para a Web... • interpretada ou não compilada; • todos os browsers actuais têm interpretadores de JS; • não é Java; • começou com o Netscape Navigator 2 (LiveScript); • dark age (JScript da Microsoft); • é uma aplicação da ECMAScript para a Web; • standards são definidos pelo W3C.
  • O que precisamos?• Editor de texto (notepad) e um browser são suficientes!• Nas aulas práticas recomendamos a utilização do WebStorm.• Mas a Web não funciona com ficheiros guardados no disco duro do nosso computador... Servidor Browser http Web
  • E para os programadores?• Responsabilidade de colocar os ficheiros no Servidor Web. • Como? • FTP, SFTP, WebDav,... • SVN, Git,... Servidor Computador Browser http Web ftp programador
  • E em LabMM 3?• Vamos construir cenários tão reais quanto possível! • Servidor Web para publicação de todos os exercícios; • Acesso FTP privado por grupos de 2; • Soluções dos alunos são públicas e acessíveis na rede da UA; • Publicação de projetos finais. linlabmm. Computador Browser clients.ua.pt programador http ftp acesso UA login/pass VPN
  • Como incluir?• Inline no header ou no body <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Exemplo</title> <script type="application/javascript"> //Código JavaScript </script> </head> <body> //Código HTML com chamadas de JavaScript //ou <script type="application/javascript"> //Código JavaScript </script> </body> </html>
  • Como incluir?• Ficheiro externo alojado no mesmo servidor <script type=”text/javascript” src=”MeuJavaScript.js” />• Ficheiro externo alojado num outro servidor <script type=”text/javascript” src=”http://outro.servidor.com/ JavaScriptDeOutros.js” /> • Vantagens: • re-utilização • manutenção • cache!
  • Primeiro exemplo: JavaScript <html> <body bgcolor="WHITE"> <p>Paragraph 1</p> <script type="text/javascript"> document.bgColor = RED; </script> </body> </html>• Boas práticas: • indentar o código; • utilizar “;” para terminar as instruções. Exemplo retirado de “Beginning JavaScript”, pág 9
  • Segundo exemplo: parsing <html> <body bgcolor="WHITE"> <p>Paragraph 1</p> <script type="text/javascript"> // Script block 1 alert("First Script Block"); </script> <p>Paragraph 2</p> <script type="text/javascript"> // Script block 2 document.bgColor = "RED"; alert("Second Script Block"); </script> <p>Paragraph 3</p> </body> </html>• Como deve ser mostrada esta página?• Escrever com alert(); Exemplo retirado de “Beginning JavaScript”, pág 10
  • Terceiro exemplo: Hello world! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <body > <p id="ResultsP"></p> <script type="text/javascript"> // Script block 1 document.getElementById(ResultsP).innerHTML = Hello World!; </script> </body> </html>• E escrever o texto no campo de um formulário? document.getElementById("campoTexto").value = “Hello World”; Exemplo retirado de “Beginning JavaScript”, pág 14
  • Tipos de dados• Diferentes abordagens por linguagem de programação • strongly typed • obrigatório explicitar o tipo de dados; • grandes restrições para operações entre diferentes tipos de dados. • weakly typed • mais fácil de utilizar mas mais suscetível a erros do programador; • em alguns casos... “seja o que o interpretador quiser”; :) • necessário perceber os fundamentos para controlar os resultados obtidos em algumas situações mais específicas.
  • Tipos de dados: tipos numéricos em C Tabela retirada de http://www.lix.polytechnique.fr/~liberti/public/ computing/prog/c/C/CONCEPT/data_types.html
  • Tipos de dados: JavaScript• Tipos de dados mais comuns: • Numéricos • inteiros (243, -9, 0) • frações/floating-point (1.2321, -43243.2) • Texto/strings • “...” ou ‘...’ • Booleanos • Verdadeiro (true) ou Falso (false)