Aici sunt prezentate diferențele dintre versiunile selectate și versiunea curentă a paginii.
Both sides previous revision Previous revision Next revision | Previous revision Next revision Both sides next revision | ||
module:07-bucle-in-programare:lectia-04 [2014/04/04 21:20] teobaluta [Tutorial 1: while] |
module:07-bucle-in-programare:lectia-04 [2014/04/08 17:58] teobaluta [Recapitulare 1: Condiții] |
||
---|---|---|---|
Linia 9: | Linia 9: | ||
==== Recapitulare 1: Condiții ==== | ==== Recapitulare 1: Condiții ==== | ||
În exercițiul recapitulativ de mai jos, vei găsi comentarii ce trebuie să faci. Completează instrucțiunile ''if'' cu condițiile potrivite pentru a afișa un singur cristal în funcție de ce număr este ales la întâmplare. | În exercițiul recapitulativ de mai jos, vei găsi comentarii ce trebuie să faci. Completează instrucțiunile ''if'' cu condițiile potrivite pentru a afișa un singur cristal în funcție de ce număr este ales la întâmplare. | ||
+ | |||
+ | <note important>În Khan, operatorul "ȘI" este ''&&'', iar operatorul "SAU" este ''||''. De exemplu, dacă vrem să verificăm că un număr este între 2 și 3, scriem ''if (numar > 2 && numar < 3)''</note> | ||
<html> | <html> | ||
Linia 30: | Linia 32: | ||
<h2><a href="http://www.khanacademy.org/cs/variabile-i-animaie-maina-albastr/4507547915517952">Variabile și animație - Mașina albastră</a></h2> <script src="http://www.khanacademy.org/cs/variabile-i-animaie-maina-albastr/4507547915517952/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> <p>Made using: <a href="http://www.khanacademy.org/cs">Khan Academy Computer Science</a>.</p> | <h2><a href="http://www.khanacademy.org/cs/variabile-i-animaie-maina-albastr/4507547915517952">Variabile și animație - Mașina albastră</a></h2> <script src="http://www.khanacademy.org/cs/variabile-i-animaie-maina-albastr/4507547915517952/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> <p>Made using: <a href="http://www.khanacademy.org/cs">Khan Academy Computer Science</a>.</p> | ||
</html> | </html> | ||
- | ===== Tutorial ===== | + | ===== Tutorial : while ===== |
- | ==== Tutorial 1: while ==== | + | ==== While ==== |
+ | |||
+ | <note warning>**Citește cu atenție tot ce scrie mai jos înainte de a te apuca de exerciții!**</note> | ||
Instrucțiunea ''while (<condition>)'' se poate traduce în ''repetă până când <condiție> este adevărată'' sau ''cât timp condiția este adevărată, fă următoarele acțiuni''. De exemplu: | Instrucțiunea ''while (<condition>)'' se poate traduce în ''repetă până când <condiție> este adevărată'' sau ''cât timp condiția este adevărată, fă următoarele acțiuni''. De exemplu: | ||
Linia 54: | Linia 58: | ||
Este valoarea lui ''a'' mai mică decât 6? **Da!** Deci ''a'' va fi egal cu ''a + 2'', adică ''5 + 2 = 7''. | Este valoarea lui ''a'' mai mică decât 6? **Da!** Deci ''a'' va fi egal cu ''a + 2'', adică ''5 + 2 = 7''. | ||
- | === Pasul 3: a este 7 === | + | === Pasul 4: a este 7 === |
Este valoarea lui ''a'' mai mică decât 6? **Nu!** Nu mai repetăm nicio acțiune din buclă și continuăm cu următoarea instrucțiune după ''}''. | Este valoarea lui ''a'' mai mică decât 6? **Nu!** Nu mai repetăm nicio acțiune din buclă și continuăm cu următoarea instrucțiune după ''}''. | ||
- | ==== Tutorial 1: for ==== | + | <note warning>Deschide programele de mai jos și dă click pe butonul **Save as a spin-off**. Doar așa se vor salva programele în contul tău și poți să le vezi dând click pe "My programs" de la link-ul [[https://www.khanacademy.org/computing/cs|https://www.khanacademy.org/computing/cs]]!</note> |
+ | ==== Tutorial 1 : Text din ce în ce mai mare ==== | ||
+ | |||
+ | Salvează programul ca spin-off (echivalentul lui remix din Scratch) și modifică-l astfel încât la fiecare pas să crească dimensiunea textului. Dimensiunea textului se poate modifica prin instrucțiunea ''textSize(x)'', unde x este cât de mare sau mic să fie textul. | ||
+ | |||
+ | <html> | ||
+ | <h2><a href="http://www.khanacademy.org/cs/while-text-cresctor/5101829118492672">While - Text crescător</a></h2> <script src="http://www.khanacademy.org/cs/while-text-cresctor/5101829118492672/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> <p>Made using: <a href="http://www.khanacademy.org/cs">Khan Academy Computer Science</a>.</p> | ||
+ | </html> | ||
+ | |||
+ | Poți încerca mai multe variante. De exemplu: | ||
+ | ''textSize(i * 10)'' | ||
+ | \\ | ||
+ | ''textSize(i + 20)'' | ||
+ | |||
+ | ==== Tutorial 2 : Text din ce în ce mai mare și în coloană ==== | ||
+ | |||
+ | Aliniază textul astfel încât să apară pe o coloană, pe verticală. **Atenție!** Textul trebuie să devină din ce în ce mai mare, nu modifica ce ai făcut la pasul anterior. | ||
+ | |||
+ | <spoiler | Arată-mi cum!> | ||
+ | <code javascript> | ||
+ | text("Bună!", 100, i * 35); | ||
+ | </code> | ||
+ | </spoiler> | ||
+ | |||
+ | ===== Exercițiul 1: Text aleator de dimensiuni diferite ===== | ||
+ | |||
+ | Scrie textul în locuri aleatoare, cu dimensiuni variabile. Adaugă două variabile a căror valoare este aleasă la întâmplare care vor semnifica poziția pe verticală a textului, adică ''y'' și poziția pe orizontală a textului, adică ''x''. | ||
+ | În instrucțiunea pentru desenarea textului avem așa: | ||
+ | ''text("Bună", poziția pe verticală, poziția pe orizontală);'' | ||
+ | |||
+ | **Indiciu!** Pentru generare aleatoare, folosește ''random(0, 400)''! | ||
+ | ===== Tutorial: for ===== | ||
+ | |||
+ | <note warning>**Citește cu atenție tot ce scrie mai jos înainte de a te apuca de exerciții!**</note> | ||
+ | |||
+ | ''for (setarea valorii unei variabile; cât timp continuăm bucla; schimbarea valorii unei variabile)'' | ||
+ | |||
+ | ==== Tutorial 4: Dreptunghiuri și bucle === | ||
+ | |||
+ | În lecția precedentă ai desenat 6 dreptunghiuri la o distanță fixă între ele. Acum poți face asta foarte ușor cu bucla ''for''. | ||
+ | Urmărește programul de mai jos și modifică-l să afișeze doar 4 dreptunghiuri! | ||
+ | |||
+ | <html> | ||
+ | <h2><a href="http://www.khanacademy.org/cs/for-dreptunghiuri/6387554690531328">For - Dreptunghiuri</a></h2> <script src="http://www.khanacademy.org/cs/for-dreptunghiuri/6387554690531328/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> <p>Made using: <a href="http://www.khanacademy.org/cs">Khan Academy Computer Science</a>.</p> | ||
+ | </html> | ||
+ | |||
+ | ===== Exercițiul 2: Bucle echivalente ===== | ||
+ | |||
+ | Refă exercițiile de la tutorial 1, 2 și 3 astfel încât să folosești bucla de tip ''for''. Uite un exemplu de transformare: | ||
+ | |||
+ | <code javascript> | ||
+ | var i = 0; | ||
+ | while (i < 10) { | ||
+ | i = i + 1; | ||
+ | } | ||
+ | </code> | ||
+ | |||
+ | este echivalent cu | ||
+ | <code javascript> | ||
+ | var i; | ||
+ | for (i = 0; i < 10; i += 1) { | ||
+ | |||
+ | } | ||
+ | </code> | ||
+ | |||
+ | ===== Bonus 1: Suma numerelor naturale ===== | ||
+ | |||
+ | Realizează un program care calculează suma numerelor naturale până la 100 folosind una din buclele învățate astăzi, adică poți folosi o buclă ''while'' sau o buclă ''for''. | ||
+ | |||
+ | Afișează suma pe ecran! Cât ți-a dat? | ||
+ | |||
+ | ===== Bonus 2: Acumulează puncte pe Khan Academy! ===== | ||
+ | |||
+ | Fă provocarea de la https://www.khanacademy.org/computing/cs/programming/looping/p/challenge-a-loopy-ruler și pe cea de la https://www.khanacademy.org/computing/cs/programming/looping/p/challenge-lined-paper | ||
+ | |||
+ | Dacă nu înțelegi ce îți cere, întreabă unul din traineri! | ||
+ | |||
+ | ===== Bonus 3: Cercuri cu același mijloc ===== | ||
+ | |||
+ | Realizează un program care să deseneze cercuri de culori diferite (alese aleator culorile). Cercurile vor avea același centru, în mijlocul planșei. Pentru a genera aleator o culoare vei folosi ''random(0, 255)'' pentru câmp din ''fill(R, G, B)'', unde ''R'' este cât de mult roșu are culoarea, ''G'' - cât de mult verde are culoarea si ''B'' cât de mult albastru are culoarea. | ||
+ | |||
+ | Ar trebui să obții ceva asemănător cu: | ||
+ | {{:module:07-bucle-in-programare:cercuri_for.png?400|}} | ||
+ | ===== Lucru pentru acasă ===== | ||
- | * Tutorial: for, while | + | Dacă nu ai reușit să termini lecția, rezolvă toate exercițiile și bonusurile! |
- | * Task-uri cu condiții și for-uri | + | Apoi, pornind de la bonusul 3, realizează o țintă cu multe cercuri. Acum nu va mai trebui să generezi la întâmplare (aleator) culorile, ci va trebui să alternezi culorile: o dată un cerc este alb, iar următorul va fi roșu. Folosește o buclă, fie ''while'', fie ''for''! |
- | * Bonus: suma numerelor naturale până la 100 | + | |
- | * Temă de casă: un joculeț în Khan | + |