Aici sunt prezentate diferențele dintre versiunile selectate și versiunea curentă a paginii.
Both sides previous revision Previous revision Next revision | Previous revision | ||
module:07-bucle-in-programare:lectia-06 [2014/04/26 02:38] fbratiloveanu [Form] |
module:07-bucle-in-programare:lectia-06 [2016/02/27 20:00] (curent) andreea creat |
||
---|---|---|---|
Linia 1: | Linia 1: | ||
- | ====== Lecția 6: Recapitulare bucle, condiții și operatori (Khan) ====== | + | ====== Lecția 6: Operatori, Condiții și Bucle ====== |
- | În lecția aceasta ne vom reaminti ce concepte de programare am învățat folosind Khan! | + | ====Recapitulare:==== |
- | === Concepte importante === | + | * Afișează o parte din numerele de la **1** la **10** pe o coloană folosind un **for**(cele pare), iar pe o altă coloană folosind un **while**(cele impare). |
- | == Operatori == | + | * Urmărește cu atenție comentariile din următorul program în Khan: <html><h2><a href="http://www.khanacademy.org/cs/m7_l5_recap_ex1/5403965253484544">M7_L5_recap_ex1</a></h2> <script src="http://www.khanacademy.org/cs/m7_l5_recap_ex1/5403965253484544/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> |
+ | |||
+ | * Uită-te cu atenție la următoarea imagine și încearcă să desenezi **10 pătrate** pe ecran cu aproximativ aceleași culori și folosind la alegere **for/while** (apasă **Click to display**): | ||
+ | <hidden> {{ :module:07-bucle-in-programare:circle_in_circle.png?nolink&300 |}}</hidden> | ||
+ | |||
+ | |||
- | De exemplu, ''==='', adică ''egal cu'' sau ''>='', adică ''mai mare sau egal cu''. Tu poți da alte exemple? | ||
- | == Condiții == | ||
- | Condițiile reflectă valoarea de adevăr a unui fapt, cum ar fi următorul exemplu: ''dacă este iunie, este cald''. Care este condiția și care este consecința? Condiția este ''dacă este iunie'', iar consecința, adică ceea ce se întâmplă dacă este adevărată condiția este ''este cald''. Te poți gândi când nu este adevărat ce am zis mai sus? Pentru țările din emisfera sudică nu va fi corect ce am spus mai sus: trebuie să spunem ''dacă este iunie și suntem în România, este cald'' iar ''dacă este iunie și suntem în Australia, este rece''. | + | ==== Tutorial 1: Operații aritmetice și comparații ==== |
- | Cum poți scrie **și** în Khan? | + | Hai să ne amintim operatorii pe care i-am învățat! |
- | == Bucle == | + | ^ Tipul operației ^ Operator ^ Exemplu ^ |
+ | | Adunare | ''+'' | <code javascript> | ||
+ | var a = 2; | ||
+ | a = a + 4; // a va fi 6 | ||
+ | var b = 0; | ||
+ | b = b + 3; // b va fi 3 | ||
+ | var c = 0; | ||
+ | c++; // c va fi 1 | ||
+ | </code> | | ||
+ | | Scădere | ''-'' | <code javascript> | ||
+ | var a = 2; | ||
+ | a = 10 - a; // a va fi 8 | ||
+ | var b = 8 - a; // b va fi 0 | ||
+ | </code> | | ||
+ | | Înmulțire | ''*'' | <code javascript> | ||
+ | var a = 5 * 4; // a este 20 | ||
+ | a = 2 * 20; // a este 40 | ||
+ | </code> | | ||
+ | | Câtul împărțirii | ''/'' | <code javascript> | ||
+ | var a = 100 / 4; // a este 25 | ||
+ | a = a / 2; // a este 12 | ||
+ | </code> | | ||
+ | | Restul împărțirii | ''%'' | <code javascript> | ||
+ | var a = 100 % 2; // a este 0 | ||
+ | a = 5 % 2; // a este 1 | ||
+ | </code> | | ||
- | Buclele repetă anumite acțiuni cât timp o condiție este îndeplinită. Ce bucle ai folosit? Poți scrie ''while'' și ''for'' echivalent? | + | Putem folosi acești operatori pentru a calcula diverse numere, de exemplu. Poți vedea un exemplu aici: [[http://www.khanacademy.org/cs/operatii/6109778351751168]]. |
+ | Hai să facem un mic exemplu cu niște comparații. Cum facem să vedem că un număr este mai mic decât 10? | ||
- | ===== Form ===== | + | <code javascript> |
+ | var numar = 3; | ||
+ | // variabila număr se tot schimbă și noi vrem să vedem dacă e mai mică decât 10 | ||
+ | if (numar < 10) { | ||
+ | // afiseaza valoarea variabilei numar | ||
+ | } | ||
+ | </code> | ||
- | <note warning>Completează formularul de la link-ul următor **individual**!</note> | + | Mai sus am folosit o **condiție**. Cum te-ai obișnuit, ''if'' (adică ''dacă'' în limba engleză) verifică adevărul unei acțiuni sau stări. De fapt, ''numar < 10'' poate lua două valori: ''true'' (adevărat) sau ''false'' (fals) și ''if'' spune calculatorului să facă ce e între acolade, cum e mai sus afișarea variabilei numar, doar dacă condiția dintre paranteze este ''true''. |
- | <html> | + | ==== Exercițiul 1: Numere mari ==== |
- | <iframe src="https://docs.google.com/forms/d/10zWNFFs_Dqe-MmmP-4OJXVOpJvYd6htt8ed6RNdt4HM/viewform?embedded=true" width="760" height="500" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe> | + | |
- | </html> | + | |
- | ===== Exerciții ===== | + | |
- | <note warning>Autentifică-te pe [[https://www.khanacademy.org/|https://www.khanacademy.org/]] cu contul personal și nu uita să dai un nume sugestiv programului tău și să îl salvezi pentru a-l putea regăsi mai târziu!</note> | + | <note warning>Autentifică-te cu contul personal pe [[https://khanacademy.org]] și rezolvă exercițiul!</note> |
- | ==== Exercițiul 1: Desenează peisajul cu o buclă! ==== | + | Scrie un program în Khan în care să generezi aleator un număr între 0 și 10000. Fă asta folosind ''random(0, 10000);''. |
+ | * dacă este între 1 și 1000, afișează "Sub o mie!" | ||
+ | * dacă restul împarțirii la 3 este 0, afișează "Divizibil cu 3!" | ||
+ | * dacă restul împărțirii la 3 nu este 0, afișează "Nedivizibil cu 3!" | ||
- | Completează programul de la [[https://www.khanacademy.org/cs/m7_l6/5765813259730944|https://www.khanacademy.org/cs/m7_l6/5765813259730944]] astfel încât să folosești o buclă while sau for și să afișezi următorul desen: | ||
- | {{:module:07-bucle-in-programare:m7_l6.png?300|}} | + | ==== Tutorial 2: Operatorul ȘI ==== |
- | Poti copia conținutul din program sau poți da click pe **Save as a spin-off** pentru a-l salva printre programele tale! | + | <note important>Operatorul ȘI în Khan îl scriem cu ''&&''! Vezi exemplu mai jos!</note> |
+ | Uneori vrem să verificăm că mai multe lucruri sunt adevărate în același timp într-o condiție. De exemplu, dacă Andrei are sub 150 cm și Andrei are sub 14 ani, are voie să meargă pe ponei gratuit. | ||
- | ==== Exercițiul 2: Funcţii pentru apăsarea mouse-ului ==== | + | <code javascript> |
+ | var inaltimeAndrei = 138; // inaltimea lui Andrei in centimetri | ||
+ | var varstaAndrei = 10; // varsta lui Andrei... in ani :) | ||
- | Urmăreşte cu atenţie următorul program: | + | if (inaltimeAndrei < 150 && varstaAndrei < 14) { |
+ | fill(255, 0, 0); | ||
+ | textSize(20); | ||
+ | text("Intra gratuit!", 100, 100); | ||
+ | } | ||
- | <html> | + | </code> |
- | <h2><a href="http://www.khanacademy.org/cs/m7_l6_mousepressed/4549721992462336">M7_L6_mousePressed</a></h2> <script src="http://www.khanacademy.org/cs/m7_l6_mousepressed/4549721992462336/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> | + | |
- | Încearcă să-l modifici astfel încât: prima dată când dai click se afişează **0**, apoi a doua oară când dai click se afişeză **1**, apoi **2**, apoi **3** şi tot aşa exact ca în următoarea imagine: | + | Deci are Andrei voie să călărească poneiul gratis? |
- | ---- | ||
- | {{ :module:07-bucle-in-programare:clock_boy.png?direct&300 |}} | ||
- | ==== Exercițiul 3: Funcţii pentru apăsarea tastelor ==== | + | ==== Tutorial 3: Operatorul SAU ==== |
- | Pentru apăsarea tastelor avem următoarele denumiri: UP(sus), DOWN(jos), LEFT(stânga), RIGHT(dreapta). | + | <note important>Operatorul SAU în Khan îl scriem cu ''||''! Vezi exemplu mai jos!</note> |
- | Pentru a verifica dacă tasta UP a fost apăsată vom folosi următoarea instrucţiune | + | |
- | ''if (keyIsPressed && keyCode===UP) { | + | Uneori vrem să verificăm cel puțin un lucru este adevărat într-o condiție. De exemplu, dacă Andrei are sub 150 cm sau Andrei are sub 14 ani, are voie să meargă pe ponei gratuit. |
- | doSomething(); | + | |
- | }'' | + | <code javascript> |
- | + | var inaltimeAndrei = 152; // inaltimea lui Andrei in centimetri | |
- | Semnificaţia ei este următoarea: dacă tastatura a fost apăsată **şi** dacă tasta apăsată este UP atunci execută ceva. | + | var varstaAndrei = 10; // varsta lui Andrei... in ani :) |
+ | |||
+ | if (inaltimeAndrei < 150 || varstaAndrei < 14) { | ||
+ | fill(255, 0, 0); | ||
+ | textSize(20); | ||
+ | text("Intra gratuit!", 100, 100); | ||
+ | } | ||
+ | |||
+ | </code> | ||
+ | |||
+ | Deci are voie Andrei să meargă pe ponei gratis? | ||
+ | ==== Exercițiul 2: Conditii compuse ==== | ||
+ | |||
+ | Urmăreşte cu atenţie comentariile din următorul program: | ||
- | Haide să ne uităm pe următorul exemplu! La final, va trebui să completezi mişcarea lui Mr Pink şi pentru restul săgeţilor. | ||
<html> | <html> | ||
- | <h2><a href="http://www.khanacademy.org/cs/m7_l6_keypressed/4639777289666560">M7_L6_keyPressed</a></h2> <script src="http://www.khanacademy.org/cs/m7_l6_keypressed/4639777289666560/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/m7_l5_ex_and_or/6357801220702208">M7_L5_ex_and_or</a></h2> <script src="http://www.khanacademy.org/cs/m7_l5_ex_and_or/6357801220702208/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> | ||
- | ==== Bonus: Cloud Party ==== | ||
- | Acum joacă-te cu următorul progrămel si pune norişorii să se mişte. Ai grijă să nu îţi iasă din ecran. | + | |
+ | ==== Tutorial 4: Bucle și condiții ==== | ||
+ | |||
+ | O animație se face folosind funcția ''draw'' din Khan, iar aceasta este echivalentul unei bucle infinite (adică la nesfârșit) care va face acțiunilie/instrucțiunile din interiorul acoladelor: | ||
+ | |||
+ | <code javascript> | ||
+ | var draw = function() { | ||
+ | // acțiuni care se tot repetă | ||
+ | }; | ||
+ | </code> | ||
+ | |||
+ | Lecțiile trecute ai învățat că asta înseamnă că putem face animații! Cum ai făcut exercițiul în care mingea se întorcea când ajungea la margine și o lua în partea opusă? Așa este, ai pus niște condiții folosind ''if''! Ceea ce se întâmplă este că vei verifica mereu acele condiții: este bila la marginea de sus? dacă da, schimbă direcția în jos; este bila la marginea de jos? dacă da, schimbă direcția în sus. | ||
+ | |||
+ | |||
+ | ==== Exercițiul 3: Nava spre steluță ==== | ||
+ | |||
+ | <note warning>Autentifică-te cu contul tău pe [[https://khanacademy.org]]. Dă click pe "Save on Khan Academy" și apoi dă "Save as a spin-off"!</note> | ||
<html> | <html> | ||
- | <h2><a href="http://www.khanacademy.org/cs/cloudparty/5579713736081408">CloudParty</a></h2> <script src="http://www.khanacademy.org/cs/cloudparty/5579713736081408/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/nava-spre-steluta/4703992924864512">Nava spre steluta </a></h2> <script src="http://www.khanacademy.org/cs/nava-spre-steluta/4703992924864512/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> | ||
- | ==== Jocuri distractive pentru acasă ==== | + | ** Rescrie programul de mai sus folosind ''while'' în loc de ''for''. ** |
- | <note tip>Încearcă să faci ceva asemănător cu imaginea de la [[http://lostgarden.com/uploaded_images/BlockRPGMockup-772331.jpg|RPG]]</note> | + | ==== Bonus 1: Suma numerelor pare și suma numerelor impare ==== |
- | <note tip>Construieşte un progrămel care la fiecare apăsare de mouse afişează un număr random de la **1** la **100**</note> | + | Scrie un program în Khan care să calculeze suma numerelor pare și suma numerelor impare de la 0 la 100. Folosește o buclă ''for'' sau una ''while''. Cum vei însuma? Ai grijă, că ai nevoie de două variabile, una pentru suma numerelor pare și alta pentru suma numerelor impare. |
- | <note tip>Construieşte un progrămel care pornind de la o valoare aleasă de voi la fiecare apăsare de taste (UP/DOWN) micşorează/măreşte variabila cu 1. Dacă avem valoarea 10, apăsând pe UP va deveni 11, apăsând pe UP va deveni 12, apăsând pe DOWN va deveni 11</note> | + | Sumă numere pare: ''0 + 2 + 4 + 6 + 8 + ... + 100 = ?'' |
+ | Sumă numere impare: ''1 + 3 + 5 + 7 + 9 + ... + 100 = ?'' | ||