![Page 1: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/1.jpg)
JScript
• Perspectiva histórica• Conceitos básicos
- exemplos de utilização- comparação crítica
• Webliografia
http://javascript.internet.com/http://www.jsworld.com/http://www.w3.org/
![Page 2: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/2.jpg)
Perspectiva histórica
• História da Internet• Aparecimento de ‘browser’ (1990)• Páginas HTML, estáticas• Necessidade de ‘interacção’
![Page 3: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/3.jpg)
Conceitos básicos (parte I)...
www.google.com indica como URL originalwww.maths.tcd.ie/pub/ guide/guide.10.html
![Page 4: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/4.jpg)
Páginas estáticas vs. interactivas
![Page 5: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/5.jpg)
Código embebido em HTML
![Page 6: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/6.jpg)
‘Aonde’ na página html ?
• No cabeçalho (tipicamente) <head> <script language=javascript>function nome(){ ...}</script></head>
• A ‘meio’ do código html<script language=javascript>document.write((new Date()).toLocaleString()); </script>
![Page 7: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/7.jpg)
‘Aonde’ na página html ?
• Num ficheiro à parte <script src=‘ficheiro.js’language=‘javascript’></script>
1. Os ficheiros (.htm e .js) são ‘copiados’1);2. Interpretados e executados pelo browser
1) Do ‘servidor’ para o ‘cliente’
![Page 8: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/8.jpg)
Object-oriented
• Uma ‘nova’ forma de organizar a programação (década de 1980)
• Relação mais estreita entre as ‘variáveis’ e as ‘funções’ que as manipulam
• ‘Objectos’ caracterizados por ‘valores’ e dispondo de ‘procedimentos’
objectoObjecto.propriedade=‘4’
Objecto.função()
![Page 9: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/9.jpg)
Elementos de formulários
• Form xptoxpto.length - nº de componentes do formulárioxpto.elements - tabela de componentes do formulário (índice de 0 a xpto.length-1)
• Text textotexto.value - texto digitado na caixa
• Checkbox caixacaixa.checked - valor boleano (V/F)caixa.value - valor associado à caixa
OQEUF ?
![Page 10: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/10.jpg)
Elementos de formulários
• Radio xpto com n posiçõesxpto[i].value - valor do botão ixpto[i].checked - valor boleano (V/F)
• Lista listalista.selectedIndex - índice da opção escolhidalista.options - Tabela de opçõeslista.options[i].value - valor da opção Ilista.options[lista.selectedIndex].value - valor da opção escolhida
OQEUF ?
![Page 11: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/11.jpg)
Navegação - chamada de uma página
• Chamada de uma página window.open(‘p.htm’, ‘nome’, width=200, height=400)p.htm - nome do ficheiro htmlnome - Nome (title) da janelawidth, height - dimensão da janela em pixels… outras opções:
menubar = falsetop = … - posição da janela a partir do topo do ecranleft = … - posição da janela a partir do lado esquerdo
![Page 12: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/12.jpg)
Navegação - criação de uma página
![Page 13: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/13.jpg)
Sintaxe
• // comentário até ao fim da linha• /* bloco de comentário */• declaração de variável: var X = expressão;
• o terminador de instruções é ;• Blocos de instruções definidos por {} • Atribuição X = expressão;
• Case sensitive (X e x são variáveis diferentes)• O tipo de X pode variar ao longo da execução do programa
![Page 14: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/14.jpg)
Tipos-base1) das variáveis
• Lógicos (Boolean)true ou false
• Números (Number)
• String
1) ou tipos primitivos
![Page 15: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/15.jpg)
Tipos-derivados das variáveis
• Arraysvar A = new Array(10);var cor = new Array(“Azul”, “Preto”, “Branco”);
• … para invocar:cor[1] = ?cor[1].length = ?cor[1].charAt(2) = ?
![Page 16: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/16.jpg)
Operadores
• Aritméticos-, +, *, /, %, ++, --
• comparação==, <, >, !=, <=, >=
• Lógicos&&, ||, ! operação válida para
números e strings
![Page 17: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/17.jpg)
Declaração de uma função
function nome(parâmetros){ // corpo da função
return resultado; //opcional}
a lista de parâmetros pode ser ()ou(p1, p2, p3) , etc...
![Page 18: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/18.jpg)
Estruturas de controlo
if (condição){ instruções...}
ou if (condição){ caso 1}else{ caso 2}
switch(expressão){ case c1:
...break;
case c2:...break;
default:...
}
![Page 19: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/19.jpg)
Estruturas de controlo
for(i=1; i<10; i++){
...
}
while(condição){
}ou
do{} while(condição);
![Page 20: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/20.jpg)
(alguns) Exemplos• umform - Exemplo de um formulário• posis - Exemplo de diferentes formas de invocação• soma2n - Exemplo da soma de 2 números• triang1 - Classificação de um triângulo• triang2 - Classificação de um triângulo - Vs. 2• totobo1 - Chave aleatória ade totobola• totobo2 - Chave aleatória de totobola - Vs. 2• fact1 - Cálculo do factorial de um número• fibo1 - Fibonacci• fibo2 - Outra versão do exemplo anterior• ordena - exemplo da ordenação de um vector
![Page 21: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/21.jpg)
Bom trabalho !
![Page 22: JScript Perspectiva histórica Conceitos básicos - exemplos de utilização - comparação crítica Webliografia](https://reader030.vdocuments.pub/reader030/viewer/2022033021/5706384b1a28abb8238f5d9f/html5/thumbnails/22.jpg)
Texto (curto)password
DropDown Texto (longo)
CheckboxRadioResetGo !