======= Lecția 1: Funcții ======= Astăzi vom învăța ce sunt funcțiile, cum să scriem funcții și la ce ne folosec acestea. Vom folosi noile cunoștințe pentru a crea programe interesante în Khan (animații, joculețe etc.). ====== Recapitulare șiruri de caractere ====== Intraţi pe următorul link şi completaţi formularul [[https://docs.google.com/forms/d/1VPl8FvLLmMN8HR4V8YK_Ji5J4msUPIo7RmarzvojjS4/viewform|acesta]] ====== Tutorial ====== ===== Ce este o funcție? ===== O funcție este o parte separată de cod căreia îi atribuim un nume. Astfel, putem folosi acea parte de cod de mai multe ori fără să o rescriem. Pe parcursul lecțiilor trecute am folosit funcții care exista deja in Khan (text, fill, rect etc.). Acum le vom explica mai în detaliu, și vom crea funcțiile noastre. ==== Exemplu ==== Pentru a desena un dreptunghi avem 2 variante: * Să îl construim din patru linii. line(20, 20 , 120, 20); line(20, 20 , 20, 180); line(20, 180 , 120, 180); line(120, 180 , 120, 20); * Să îl construim folosind functia //rect// care exista deja. rect(20, 20, 120, 180); Ambele variante de cod vor afișa același dreptunghi. {{:module:10-functii-si-rutine:screen_shot_2014-02-21_at_21.21.03.png?200|}} Pentru a desena o imagine cu 4 dreptunghiuri ar trebui să folosim 16 linii. Mult mai simplu este să folosim funcția //rect// de patru ori. Pentru a testa cele afirmate mai sus, copiați codul din imagine într-un nou program în Khan Academy. {{:module:10-functii-si-rutine:modul10_ex1.png?|}} Pentru a desena o linie folosim //line// care este tot o funcție. Funcția //line// desenează de fapt o mulțime de puncte care formează linia. ===== Cum se definește o funcție? ===== Toate funcțiile se scriu într-un anumit fel pentru a putea fi recunoscute de calculator. Când scriem o funcție se numește că definim o funcție. În Khan funcțiile se definesc astfel: var primaFunctie = function() { fill(255, 0, 0); text("hello world", 100, 100); }; **Numele funcției** este //primaFunctie//, iar ce face funcția se află între acolade și se numește **corpul funcției**. ==== Exemplu ==== Mai jos este definită o funcție care desenează un fulg de nea. {{:module:10-functii-si-rutine:fulg_de_nea_definire.png|}} * Creați un nou proiect în Khan Academy în care să definiția funcția, urmărind codul din imaginea de mai sus * Observați că deocamdată funcția nu desenează nimic pe ecran. * Pentru a folosi funcția ca să desenăm fulgi de nea trebuie să o **apelăm**. ===== Cum se apelează o funcție? ===== Pentru a folosi o funcție aceasta trebuie apelată (chemată). O funcție poate fi apelată numai după ce a fost declarată. Din această cauză vom declara toate funcțiile la începutul programului. Apelarea unei funcții se face folosind numele funcției urmat de paranteze și punct și virgula: //numeFunctie();//. ====Exercițiu==== Mergeți la exemplul //Fulgi de nea// de mai sus și sub funcția //desenFulg// scrieți mai multe apeluri la această funcție. Când am definit funcția desenFulg am specificat cum se construiește un fulg de nea. Ca să construim fizic (pe spațiul de desen) fulgul de nea am apelat funcția. Pentru a desena mai mulți fulgi de nea a fost suficient să apelăm funcția de mai multe ori, dar nu am mai rescris codul care construiește un fulg de nea. ===== Parametrii unei funcții ===== Parametrii unei funcții reprezintă valori care sunt transmise funcției din afara acesteia. Funcția își va modifica rezultatul în funcție de parametri transmiși. * Transmiterea parametrilor se face la apelul funcței astfel: //numeFunctie(parametru1, parametru2);// Funcția //ellipse// primește patru parametri, primi doi stabilesc pozitia elipsei iar următorii doi dimensiunea acesteia: //ellipse(150, 150, 50, 30);// * O funcție trebuie declarată astfel pentru a putea primi parametri: var numeFunctie = function(parametru1, parametru2) { // corp functie }; ==== Exercițiu ==== * Modificati programul precedent astfel încât fulgii de nea să fie poziționați unde vrem noi pe ecran. * Pentru aceasta, va trebui să definiți variabilele ''x'' și ''y'' ca parametri ai funcției. * Desenați apoi 5 fulgi de nea astfel: câte unul în fiecare colț și unul în centrul ecranului. ===== Funcții care întorc valori ===== Funcțiile nu se folosesc numai pentru desen. Câteodată dorim ca o funcție să calculeze un rezultat sau să modifice un text. În aceste cazuri o să dorim ca funcția să ne întoarcă un rezultat acolo unde am apelat-o. ==== Exemplu ==== Să presupunem că avem mai multe propoziții și dorim să aflăm numărul de vocale din fiecare. Pentru a nu scrie cod care face același lucru de mai multe ori vom folosi o funcție care primește ca parametru o propoziție, apoi calculează și întoarce numărul de vocale din aceasta. {{:module:10-functii-si-rutine:modul10_ex3.png?|}} Click pe imagine ca să o puteți vedea la o dimensiune mai mare. ==== Exercițiu ==== Modificați codul astfel încât funcția să returneze numărul de consoane din propoziție. Pentru a întoarce o valoare trebuie să scriem la sfârșitul funcției //return ceVremSaIntoarca//. Rezultatul va fi întors exact în locul de unde am făcut apelul funcției. O funcție poate întoarce un singur rezultat. ====== Exerciții ====== Figuri geometrice custom * Creați un program nou cu numele **figuri geometrice custom**. * Scrieți o funcție cu numele **triunghiGalben** care să primească parametri x1, y1, x2, y2, x3, y3 și să deseneze un triunghi galben cu coordonatele primite. Apelați funcția o dată cu ce parametri vreți. * Scrieți o funcție **cerc** care desenează un cerc în funcție de poziție, rază și culoare. Testați funcția. * Construiți o funcție **verificaPatrat** care primește poziția și dimensiunile unui dreptunghi, apoi verifică dacă dreptunghiul este și pătrat. * Dacă este pătrat, funcția îl va desena de culoarea albastră * Dacă nu este pătrat, funcția va desena dreptunghiul cu proprietățile primite de culoare roșie. * Desenați un pătrat și un dreptunghi apelând funcția. * Folosind funcțiile de mai sus creați un desen pe ce temă vreți voi (Exemple: lumea roboților, micul dejun, în parc ...). Puteți folosi și funcțiile din Khan, dar folosiți cel puțin două dintre funcțiile scrise de voi. Zmeie * Aveți aici background-ul unei zile senine, dar cu vânt, numai bună de înălțat zmeie http://www.khanacademy.org/cs/zmeie-backgound/5923981364297728. * Va trebui să scrieți o funcție care să deseneze zmeie ca în desenul de mai jos. {{:module:10-functii-si-rutine:screen_shot_2014-03-02_at_19.41.16.png?300|}} * Funcția va primi parametri centrul rombului care reprezintă zmeul, lungimea diagonalei pe x și lungimea diagonalei pe y. Va trebui să desenați un poligon colorat în formă de romb și peste el două linii (diagonalele rombului) pentru a obține imaginea unui zmeu. În funcție veți folosi: //quad(x1, y1, x2, y2, x3, y3, x4, y4)// o data //line(x1, y1, x2, y2)// de doua ori Aveți aici un desen cu proprietățile rombului. {{:module:10-functii-si-rutine:screen_shot_2014-03-02_at_19.56.44.png?300|}} ====== Bonus ====== Construiți o funcție care desenează o bucată dintr-un gard. Folosiți funcțiile [[https://www.khanacademy.org/cs/beginshapeendshape/5462945756610560|beginShape() și endShape()]]. Desenați un gard apelând funcția definită într-un loop. ====== Exerciții pentru acasă ====== Noaptea: * Creați un program nou cu numele //noaptea//. * Definiți o funcție pentru a desena o stea. * Scrieți o funcție care desenează luna. * Definiți o funcție care desenează un copac. * Creați un peisaj de noapte prin mai multe apeleuri la funcțiile definite.