Commit inicial - add do repo privado para o repo NT style: changes header's logo and colors style: changes home page first session layout feat: creates about us home page section chore: creates home page section for whom chore: creates student materails home page section chore: creates teachers materials home page section chore: creates teacher materials home page section style: changes primary color style: changes color at activities page style: changes about page color style: changes name to Decoda fix: changes route to about page at footer fix: changes background color style: changes game page header colors style: changes footer colors chore: adds home page sections title style: changes main font family to Lato style: adds title font fix: changes sizes to be more responsive for mobile ajuste no build vercel atualiza regras envio homol Adiciona instrucoes de uso add JupyterLite fix solucao turtle Add Mole Mash e Modal de Falhas Add Progress Bar na pagina de Atividades fix game name chore: atualiza lockfile removendo vercel analytics inclusão de efeito ao mudar de fase add mecanismo de solução de fases em debug vite config test add BaseGame e refator do MoleMash refatoração turtle refatoração automato refatoração automato add tag bug 1 e 2 automato mostrar apenas games em homologação na pagina de atividades aumentar timeout das fases finais do Turtle fix bug scroll add video refactor semaforo arrumar ordem das cores add build docs update vercel update vercel update vercel update vercel update vercel add vercel jupyter add vercel jupyter fix deploy Vercel fix deploy Vercel fix deploy Vercel add cripto add cripto refatoração fix tour Mole Mash . remover arquivos de controle chore: adds development tag for activity card remover arquivos de status indevidamente versionados atualizar cores nas atividades add Quebra Cabeças add Quebra Cabeças add iniciativas add Iniciativas alteração de fotos pesadas fix menu mobile fix menu mobile fix menu mobile add Aspirador update icons update identidade visual documentação update jupyter add kernel python local add kernel python local add kernel python local feat: add health check feat: add primeiros passos add letramento mover letramento de lugar update path games update path games fix: ajuste clique rapido no botão executar remover dead code fix: refactor: extract shared utilities for storage, phase unlock and mobile detection stabilize context references and fix stale closure extrair GameProgressContext do GameStateContext (SRP) refactor(game): extrair usePhaser e useGameModals de GameBase + corrigir bugs descobertos refactor(game): remove todos os aliases PT/EN duplicados Remover aliases PT/EN da camada de modais refactor + tests security: add CodeSanitizer and integrate into GameInterpreter - CodeSanitizer.js: 4 built-in rules (max_length, infinite_while, infinite_for, excessive_nesting) with pluggable extra rules - GameInterpreter.executeCode: calls sanitizeCode() before js-interpreter, differentiates CodeSanitizationError (warn) from other errors (error) - 21 unit tests for CodeSanitizer (100% coverage) - 4 integration tests in GameInterpreter for sanitization paths add CodeSanitizer fix: fase 10 aspirador fix: bug semaforo teste feat: add version Ajusta a landing page para ficar mais próxima ao protótipo ajusta raio da borda do botão de Acesse nosso Laboratório pequenos ajustes de layout na página de iniciativas atualiza tabela de jogos educativos com os jogos disponíveis atualmente ajustados pequenos detalhes e informações do jogos na seção de guias pedagógicos troca nome playground para laboratório e adiciona imagens do lab adiciona documentação de conceitos básicos de programação ajustado pequenos erros de digitação adiciona tooltip com conceitos escondidos em hover na tag +N de conceitos update docs dev desativar tour setup matriz MoleMash setup matriz MoleMash fix: link update version update docs update docs mudou o layout de quem somos mudei as imgs dos icons e baixei o botao centraliza titulo com imagem e ajusta sessão com gradiente vermelho-rosa adiciona responsividade para a pagina quem somos ajusta botão de conheça nossa história ajustes ajustes na home + add. teclado update version security security feat: add tapume para telas pequenas v1.1.0 feat: decoda offline feat: doc offline offline fix: ajustes para release fix: navbar; config ordenação; versão fix: rotas docs e jupyter para pwa delete private files Co-authored-by: Indra Araujo <indra.araujo.santos@gmail.com> Co-authored-by: solange dos santos <sollangelive71@gmail.com>
303 lines
8.8 KiB
Markdown
303 lines
8.8 KiB
Markdown
---
|
|
sidebar_position: 2
|
|
title: "Loops (Repetição)"
|
|
---
|
|
|
|
# Loops - A Arte da Repetição
|
|
|
|
**Loops** são como receitas que dizem "faça isso várias vezes". É o computador sendo eficiente: em vez de escrever a mesma coisa 100 vezes, ele repete automaticamente!
|
|
|
|
## **O que são Loops?**
|
|
|
|
Loops são **estruturas de repetição** que fazem o programa executar as mesmas ações múltiplas vezes, sem precisar reescrever o código.
|
|
|
|
### **Analogia: Caminhada**
|
|
|
|
Imagine que você precisa dar 10 passos:
|
|
|
|
- **SEM LOOP**: Passo 1, Passo 2, Passo 3... (escrever 10 vezes)
|
|
- **COM LOOP**: "Repita 10 vezes: dê um passo"
|
|
|
|
Muito mais simples, não é?
|
|
|
|
## **Como Funcionam?**
|
|
|
|
### **Estrutura Básica**
|
|
|
|
```
|
|
REPITA X vezes:
|
|
faça isso
|
|
```
|
|
|
|
ou
|
|
|
|
```
|
|
ENQUANTO (condição verdadeira):
|
|
faça isso
|
|
```
|
|
|
|
## **Atividades Desplugadas**
|
|
|
|
### **1. Robô Repetidor**
|
|
|
|
**Material**: Cartões com comandos
|
|
|
|
**Como fazer**:
|
|
|
|
1. Um estudante é o "robô"
|
|
2. Outro é o "programador"
|
|
3. Programador dá comando: "Repita 5 vezes: levante o braço direito"
|
|
4. Robô executa exatamente 5 vezes
|
|
|
|
### **2. Música em Loop**
|
|
|
|
**Material**: Uma música conhecida
|
|
|
|
**Como fazer**:
|
|
|
|
1. Escolham um refrão simples
|
|
2. "Repita 3 vezes: Parabéns pra você..."
|
|
3. Todos cantam o refrão 3 vezes seguidas
|
|
4. Experimente com números diferentes
|
|
|
|
### **3. Receita de Biscoitos**
|
|
|
|
**Material**: Papel e caneta
|
|
|
|
**Como fazer**:
|
|
|
|
1. Escreva receita para 1 biscoito
|
|
2. Agora para 12 biscoitos sem loop:
|
|
- "Misture farinha, misture farinha, misture farinha..." (12 vezes)
|
|
3. Com loop:
|
|
- "Repita 12 vezes: misture farinha, adicione açúcar, modele"
|
|
|
|
## **Tipos de Loops**
|
|
|
|
```mermaid
|
|
flowchart TD
|
|
A[Preciso repetir uma ação] --> B{Sei quantas vezes?}
|
|
B -->|Sim| C[Use FOR]
|
|
B -->|Não| D{Tenho condição de parada?}
|
|
D -->|Sim| E[Use WHILE]
|
|
D -->|Não| F[Reveja a lógica para evitar loop infinito]
|
|
C --> G{É para cada item de lista?}
|
|
G -->|Sim| H[Use FOR EACH]
|
|
G -->|Não| I[FOR tradicional]
|
|
```
|
|
|
|
### **1. Loop com Contador (FOR)**
|
|
|
|
- Repete um **número específico** de vezes
|
|
- "Faça isso 10 vezes"
|
|
|
|
**<i class="fas fa-home"></i> Exemplo**: Escovar dentes
|
|
|
|
- Repita 20 vezes: mova a escova para cima e para baixo
|
|
|
|
### **2. Loop com Condição (WHILE)**
|
|
|
|
- Repete **enquanto** algo for verdadeiro
|
|
- "Faça isso enquanto..."
|
|
|
|
**<i class="fas fa-car"></i> Exemplo**: Dirigir até o destino
|
|
|
|
- Enquanto não chegou no destino: continue dirigindo
|
|
|
|
### **3. Loop para Cada Item (FOR EACH)**
|
|
|
|
- Repete **para cada** elemento de uma lista
|
|
- "Para cada item, faça isso"
|
|
|
|
**<i class="fas fa-shopping-bag"></i> Exemplo**: Lista de compras
|
|
|
|
- Para cada item da lista: pegue o produto
|
|
|
|
## **Loops no Cotidiano**
|
|
|
|
### **Em Casa**
|
|
|
|
- **<i class="fas fa-utensils"></i> Lavar louça**: Para cada prato sujo, lave
|
|
- **<i class="fas fa-broom"></i> Varrer casa**: Para cada cômodo, varra
|
|
- **<i class="fas fa-shower"></i> Tomar banho**: Repita até ficar limpo: ensaboe e enxágue
|
|
|
|
### **Na Escola**
|
|
|
|
- **<i class="fas fa-pencil-alt"></i> Tabuada**: Repita 10 vezes: 2 x número
|
|
- **<i class="fas fa-book"></i> Leitura**: Para cada página do livro, leia
|
|
- **<i class="fas fa-running"></i> Educação física**: Repita 20 vezes: flexão
|
|
|
|
### **Na Tecnologia**
|
|
|
|
- **<i class="fas fa-envelope"></i> Email**: Para cada mensagem nova, notifique
|
|
- **<i class="fas fa-video"></i> Vídeo**: Repita 30 vezes por segundo: mostre frame
|
|
- **<i class="fas fa-gamepad"></i> Jogos**: Enquanto jogo não acabou: continue rodando
|
|
|
|
## **Na Programação Visual**
|
|
|
|
### **Blocos de Loop**
|
|
|
|
No Decoda, você verá:
|
|
|
|
- **<i class="fas fa-sync"></i> Bloco "Repetir"**: Formato circular ou oval
|
|
- **<i class="fas fa-hashtag"></i> Número**: Quantas vezes repetir
|
|
- **<i class="fas fa-code"></i> Comandos dentro**: O que será repetido
|
|
|
|
### **Exemplo no Jogo Tartaruga**
|
|
|
|
1. **Repetir 4 vezes**:
|
|
- Ande 100 passos
|
|
- Vire 90 graus à direita
|
|
2. **Resultado**: Desenha um quadrado!
|
|
|
|
## **Cuidados com Loops**
|
|
|
|
### **Loop Infinito**
|
|
|
|
- **Problema**: Loop que nunca para
|
|
- **Exemplo**: "Enquanto 1 = 1: diga olá" (nunca vai parar!)
|
|
- **Solução**: Sempre ter uma condição de parada
|
|
|
|
### **Loop Muito Lento**
|
|
|
|
- **Problema**: Muitas repetições desnecessárias
|
|
- **Exemplo**: "Repita 1 milhão de vezes: pisque"
|
|
- **Solução**: Use apenas o número necessário
|
|
|
|
## **Atividades Práticas com Decoda**
|
|
|
|
### **1. Desenhar Formas**
|
|
|
|
- **Triângulo**: Repita 3 vezes (ande, vire 120°)
|
|
- **Quadrado**: Repita 4 vezes (ande, vire 90°)
|
|
- **Estrela**: Repita 5 vezes (ande, vire 144°)
|
|
|
|
### **2. Mover Personagem**
|
|
|
|
- **Andar em linha**: Repita 10 vezes (ande 1 passo)
|
|
- **Dança**: Repita 5 vezes (esquerda, direita, pule)
|
|
- **Patrulha**: Enquanto não encontrar inimigo, ande
|
|
|
|
### **3. Sons e Efeitos**
|
|
|
|
- **Sirene**: Repita 10 vezes (som agudo, som grave)
|
|
- **Batida**: Repita enquanto música toca (toque tambor)
|
|
- **Eco**: Para cada nota, repita 3 vezes mais baixo
|
|
|
|
## **Dicas para Educadores**
|
|
|
|
### **Como Ensinar**
|
|
|
|
1. **<i class="fas fa-eye"></i> Mostre a ineficiência primeiro**: Escreva sem loop
|
|
2. **<i class="fas fa-magic"></i> Apresente o loop como mágica**: "E se eu disser que há um jeito mais fácil?"
|
|
3. **<i class="fas fa-hands"></i> Use atividades físicas**: Loops corporais
|
|
4. **<i class="fas fa-step-forward"></i> Vá do simples ao complexo**: Comece com números pequenos
|
|
|
|
### **Erros Comuns**
|
|
|
|
- **Esquecer a condição de parada**: Criar loops infinitos
|
|
- **Contar errado**: "Repita 5 vezes" mas contar 6
|
|
- **Loop desnecessário**: Usar loop para uma única ação
|
|
- **Condição sempre falsa**: Loop que nunca executa
|
|
|
|
### **Sinais de Compreensão**
|
|
|
|
- Identifica repetições no cotidiano
|
|
- Escolhe o tipo certo de loop
|
|
- Prevê quantas vezes algo vai repetir
|
|
- Explica quando usar ou não usar loops
|
|
|
|
## **Pensamento Computacional**
|
|
|
|
### **Reconhecimento de Padrões**
|
|
|
|
- Identificar quando algo se repete
|
|
- Ver semelhanças em diferentes situações
|
|
|
|
### **Decomposição**
|
|
|
|
- Quebrar problema grande em pequenas repetições
|
|
- "Como faço uma vez?" → "Como repito muitas vezes?"
|
|
|
|
### **Abstração**
|
|
|
|
- Focar no padrão, não nos detalhes
|
|
- "O que se repete é o importante"
|
|
|
|
### **Algoritmos**
|
|
|
|
- Criar sequências eficientes
|
|
- Otimizar através da repetição
|
|
|
|
## **Objetivos de Aprendizagem**
|
|
|
|
Ao final desta seção, estudantes devem conseguir:
|
|
|
|
- **<i class="fas fa-check"></i>** Identificar repetições no cotidiano
|
|
- **<i class="fas fa-check"></i>** Escolher o tipo apropriado de loop
|
|
- **<i class="fas fa-check"></i>** Criar loops simples na programação visual
|
|
- **<i class="fas fa-check"></i>** Evitar loops infinitos
|
|
- **<i class="fas fa-check"></i>** Otimizar código usando repetição
|
|
|
|
## **Atividades de Fixação**
|
|
|
|
### **1. Identifique o Loop**
|
|
|
|
Transforme estas ações em loops:
|
|
|
|
- Subir 10 degraus
|
|
- Ler todas as páginas de um livro
|
|
- Lavar todos os pratos
|
|
|
|
### **2. Conte as Repetições**
|
|
|
|
Quantas vezes o loop executará?
|
|
|
|
- Repita 5 vezes: pule
|
|
- Enquanto bateria > 0: use celular
|
|
- Para cada dedo da mão: conte
|
|
|
|
### **3. Construa o Loop**
|
|
|
|
Crie loops para:
|
|
|
|
- Desenhar escadinha de 6 degraus
|
|
- Tocar "Parabéns" 3 vezes
|
|
- Verificar chuva até parar
|
|
|
|
## **Referências e Recursos**
|
|
|
|
### **Sites Educativos**
|
|
|
|
- [Code.org - Loops](https://code.org/curriculum/course2/5/Activity5-Loops.pdf) - Atividades com loops
|
|
- [CS Unplugged - Algorithms](https://csunplugged.org/en/topics/algorithms/) - Algoritmos sem computador
|
|
- [Scratch - Repetition](https://scratch.mit.edu/ideas) - Ideias para loops
|
|
|
|
### **Vídeos Explicativos**
|
|
|
|
- [Loops Explained](https://www.youtube.com/watch?v=mgooqyWMTxk) - Explicação visual
|
|
- [Repetition in Programming](https://www.youtube.com/watch?v=wxds6MAtUQ0) - Code.org
|
|
- [For Loops vs While Loops](https://www.youtube.com/watch?v=94UHCEmprCY) - Diferenças
|
|
|
|
### **Jogos e Atividades**
|
|
|
|
- [Cargo Bot](http://twolivesleft.com/CargoBot/) - Programa robô com loops
|
|
- [Human Resource Machine](https://tomorrowcorporation.com/humanresourcemachine) - Puzzles com loops
|
|
- [While True: Learn()](https://luden.io/wtl/) - Machine learning com loops
|
|
|
|
### **Literatura Acadêmica**
|
|
|
|
- Weintrop, D. (2016). _Defining Computational Thinking for Mathematics and Science_
|
|
- Yadav, A. (2014). _Computational Thinking in Elementary and Secondary Education_
|
|
- Grover, S. (2013). _Learning to Code, Coding to Learn_
|
|
|
|
### **Ferramentas Complementares**
|
|
|
|
- [Logo Programming](http://www.logointerpreter.com/) - Desenhos com loops
|
|
- [Alice](http://www.alice.org/) - Programação 3D com repetição
|
|
- [Greenfoot](https://www.greenfoot.org/) - Java visual com loops
|
|
|
|
---
|
|
|
|
**<i class="fas fa-arrow-right"></i> Próximo**: Descubra [**Funções**](./funcoes) para organizar e reutilizar seu código!
|