JavaScript: Sempre a repetir o mesmo? :-/
Carlos Santos
LabMM 3 - NTC - DeCA - UA
Aula 08 e 09, 11-10-2013 e 16-10-2013
Como “simplificar” trabalhos repetitivos?
Como repetir?
• 2 tipos de estruturas de repetição:
• for
• repetição baseada num número de vezes pré-determinado
• while
...
Estrutura de repetição: for
inicialização da
variável de ciclo

condição de
teste do ciclo

incremento da
variável de cicl...
Estrutura de repetição: for
a variável contadora
já foi declarada
anteriormente?

var cont;
for ( cont = valorInicial; con...
Observações [idiotas?]
• A variável contadora do ciclo pode ter um nome qualquer
• “cont” é só um exemplo!
• O incremento ...
for: como funciona?
1. Executar a parte de inicialização do ciclo.
2. Verificar a condição de teste.
i. Se verdadeira, cont...
for: como funciona em fluxograma
1. inicialização
ciclo;

5...
4. incremento de
variável de ciclo;

2. Condição
de teste

t...
for: Exemplo (1)
•

Qual o resultado?

var i;
for (i = 0; i <= 5; i++)
{
document.write("O número é " + i);
document.write...
for: Exemplo (2)
•

Qual o resultado?

var x = 0;
for (x = 10; x >= 0; x = x - 2)
{
document.write("O número é " + x);
doc...
for: Exemplo (3)
•

Qual o resultado?

var num = prompt(“Número?”, “”);
// Aqui falta uma rotina de validação
var i;
for (...
for...in e for each...in
• estruturas de repetição para utilizar com objetos (arrays na maioria dos casos
encontrados em L...
Estrutura de repetição: while
enquanto a condição for
verdadeira o ciclo continua

while ( condição )
{
// código a execut...
while: como funciona em fluxograma

1. Condição
de teste

true

2. bloco de código;

false
while: Exemplo (1)
•

Qual o resultado?

var i = 0;
while (i <= 5)
{
document.write("O número é " + i);
document.write("<b...
while: Exemplo (2)
•

Qual o resultado?

var i = 0;
while (i <= 5)
{
document.write("O número é " + i);
document.write("<b...
while: Exemplo (3)
•

Qual o resultado?

var i = 0;
while (i <= 5)
{
i++;
document.write("O número é " + i);
document.writ...
Estrutura de repetição: do...while

do
{
// código a executar
}
while ( condição )

enquanto a condição for
verdadeira o c...
do..while: como funciona em fluxograma

1. bloco de código;

2. Condição
de teste

true

false
do...while: Exemplo (1)
•

Qual o resultado?

var i = 0;
do
{
document.write("O número é " + i);
document.write("<br />");...
do...while: Exemplo (2)
•

Qual o resultado?

var i = 0;
do
{
i++;
document.write("O número é " + i);
document.write("<br ...
do...while: Exemplo (3)
•

Qual o resultado?

var userAge=””;
do
{
userAge = prompt(“Please enter your age”,””)
}
while (i...
do...while: Exemplo (4)
•

Qual o resultado?

var userAge=””;
do
{
userAge = prompt(“Please enter your age”,””)
}
while (i...
ciclos dentro de ciclos (nested)
•

Qual o resultado?
var linha = 0, coluna = 0;
document.writeln("<table>");
for (linha=1...
Próximos SlideShares
Carregando em…5
×

T08_T09_LM3: Estruturas de repetição (2013-2014)

586 visualizações

Publicada em

Publicada em: Educação
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
586
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
32
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

T08_T09_LM3: Estruturas de repetição (2013-2014)

  1. 1. JavaScript: Sempre a repetir o mesmo? :-/ Carlos Santos LabMM 3 - NTC - DeCA - UA Aula 08 e 09, 11-10-2013 e 16-10-2013
  2. 2. Como “simplificar” trabalhos repetitivos?
  3. 3. Como repetir? • 2 tipos de estruturas de repetição: • for • repetição baseada num número de vezes pré-determinado • while • repetição até que uma determinada condição seja verdadeira
  4. 4. Estrutura de repetição: for inicialização da variável de ciclo condição de teste do ciclo incremento da variável de ciclo for ( cont = valorInicial; cont <= valorFinal; cont++) { // código a executar }
  5. 5. Estrutura de repetição: for a variável contadora já foi declarada anteriormente? var cont; for ( cont = valorInicial; cont <= valorFinal; cont++) { // código a executar } for (var cont = valorInicial; cont <= valorFinal; cont++) { // código a executar }
  6. 6. Observações [idiotas?] • A variável contadora do ciclo pode ter um nome qualquer • “cont” é só um exemplo! • O incremento da variável contadora pode ser realizado com base em qualquer valor inteiro (positivo ou negativo) • ++ é um valor muito utilizado... mas apenas isso! • O valor da variável contadora não deve ser alterado dentro do bloco de instruções • é possível... mas é bom saber muito bem o que se está a fazer :)
  7. 7. for: como funciona? 1. Executar a parte de inicialização do ciclo. 2. Verificar a condição de teste. i. Se verdadeira, continuar; ii. Se não, terminar o ciclo. 3. Executar o código existente no bloco de instruções. 4. Executar a parte de incremento do ciclo. 5. Repetir os passos 2 a 4, até a condição de teste ser falsa.
  8. 8. for: como funciona em fluxograma 1. inicialização ciclo; 5... 4. incremento de variável de ciclo; 2. Condição de teste true 3. bloco de código; false
  9. 9. for: Exemplo (1) • Qual o resultado? var i; for (i = 0; i <= 5; i++) { document.write("O número é " + i); document.write("<br />"); }
  10. 10. for: Exemplo (2) • Qual o resultado? var x = 0; for (x = 10; x >= 0; x = x - 2) { document.write("O número é " + x); document.write("<br />"); }
  11. 11. for: Exemplo (3) • Qual o resultado? var num = prompt(“Número?”, “”); // Aqui falta uma rotina de validação var i; for (i = 1; i <= 10; i++) { document.write(num + “ * " + i + “ = “ + num*i); document.write("<br />"); }
  12. 12. for...in e for each...in • estruturas de repetição para utilizar com objetos (arrays na maioria dos casos encontrados em LabMM3) • são rotinas que simplificam o acesso aos diferentes elementos de um objeto; • tudo o que permitem fazer também pode ser conseguido com um ciclo for “normal”; • voltaremos mais tarde a estas estruturas de repetição!
  13. 13. Estrutura de repetição: while enquanto a condição for verdadeira o ciclo continua while ( condição ) { // código a executar } a condição pode ser qualquer expressão que tenha como resultado um valor booleano o código a executar deve conter alguma instrução que possa ter impacto no valor da condição
  14. 14. while: como funciona em fluxograma 1. Condição de teste true 2. bloco de código; false
  15. 15. while: Exemplo (1) • Qual o resultado? var i = 0; while (i <= 5) { document.write("O número é " + i); document.write("<br />"); }
  16. 16. while: Exemplo (2) • Qual o resultado? var i = 0; while (i <= 5) { document.write("O número é " + i); document.write("<br />"); i++; }
  17. 17. while: Exemplo (3) • Qual o resultado? var i = 0; while (i <= 5) { i++; document.write("O número é " + i); document.write("<br />"); }
  18. 18. Estrutura de repetição: do...while do { // código a executar } while ( condição ) enquanto a condição for verdadeira o ciclo continua o código é sempre executado pelo menos uma vez
  19. 19. do..while: como funciona em fluxograma 1. bloco de código; 2. Condição de teste true false
  20. 20. do...while: Exemplo (1) • Qual o resultado? var i = 0; do { document.write("O número é " + i); document.write("<br />"); i++; } while (i <= 5);
  21. 21. do...while: Exemplo (2) • Qual o resultado? var i = 0; do { i++; document.write("O número é " + i); document.write("<br />"); } while (i <= 5);
  22. 22. do...while: Exemplo (3) • Qual o resultado? var userAge=””; do { userAge = prompt(“Please enter your age”,””) } while (isNaN(userAge) == true);
  23. 23. do...while: Exemplo (4) • Qual o resultado? var userAge=””; do { userAge = prompt(“Please enter your age”,””) } while (isNaN(userAge));
  24. 24. ciclos dentro de ciclos (nested) • Qual o resultado? var linha = 0, coluna = 0; document.writeln("<table>"); for (linha=1; linha<=10; linha++) { document.writeln("<tr>"); for (coluna=1; coluna<=10; coluna++) { document.writeln("<td>"+linha*coluna+"</td>"); } document.writeln("</tr>"); } document.writeln("</table>");

×