Până acum am generat date de ieșire folosind alert; pentru fiecare mesaj afișam o casetă de dialog. Există și alte variante de a genera date de ieșire. În cadrul acestui episod vom scrie date în pagina propriu zisă. Pentru aceasta vom scrie document.writeln în loc de alert și la sfârșitul fiecărui string va trebui să adăugăm <br/>. Pentru a explica de ce este nevoie de acest ar trebui să intrăm în detalii legate de HTML. Deocamdată, să îl considerăm a fi un marcaj de sfărșit de linie în HTML, echivalent cu \n din JavaScript. Trebuie să folosim marcajul din HTML fiidcă prin document.writeln adăugăm cod în pagina HTML.
Pe măsură ce scriem din ce în ce mai mult cod, acesta devine mai greu de urmărit. Vă amintiți de lunga secvență if, else, if din episodul anterior? Atunci am avut o soluție cu switch, dar în alte situații instrucțiunile nu au astfel de caracteristici comune. Totuși, am putea dori să le grupăm cumva. Am văzut că avem grupuri de instrucțiuni, dar nici acestea nu sunt utile decât în anumite situații.
Ar fi frumos dacă am putea împărți codul în bucățele mici, ușor de înțeles, pe care să le folosim cum vrem. Să ne imaginăm că vrem să tipărim versurile din Gaudeamus. Deocamdată, programul nostru ar arăta cam așa:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
document.writeln("Gaudeamus igitur<br/>") document.writeln("Iuvenes dum sumus.<br/>") document.writeln("Post iucundam iuventutem<br/>") document.writeln("Post molestam senectutem<br/>") document.writeln("Nos habebit humus.<br/>") document.writeln("<br/>") document.writeln("Ubi sunt qui ante nos<br/>") document.writeln("In mundo fuere?<br/>") document.writeln("Vadite ad superos<br/>") document.writeln("Transite in inferos<br/>") document.writeln("Hos si vis videre.<br/>") document.writeln("<br/>") document.writeln("Vita nostra brevis est<br/>") document.writeln("Brevi finietur.<br/>") document.writeln("Venit mors velociter<br/>") document.writeln("Rapit nos atrociter<br/>") document.writeln("Nemini parcetur.<br/>") document.writeln("<br/>") document.writeln("Vivat academia!<br/>") document.writeln("Vivant professores!<br/>") document.writeln("Vivat membrum quodlibet;<br/>") document.writeln("Vivant membra quaelibet;<br/>") document.writeln("Semper sint in flore.<br/>") document.writeln("<br/>") document.writeln("Vivant omnes virgines<br/>") document.writeln("Faciles, formosae.<br/>") document.writeln("Vivant et mulieres<br/>") document.writeln("Tenerae, amabiles,<br/>") document.writeln("Bonae, laboriosae.<br/>") document.writeln("<br/>") document.writeln("Vivat et res publica<br/>") document.writeln("et qui illam regit.<br/>") document.writeln("Vivat nostra civitas,<br/>") document.writeln("Maecenatum caritas<br/>") document.writeln("Quae nos hic protegit.<br/>") document.writeln("<br/>") document.writeln("Pereat tristitia,<br/>") document.writeln("Pereant osores.<br/>") document.writeln("Pereat diabolus,<br/>") document.writeln("Quivis antiburschius<br/>") document.writeln("Atque irrisores.<br/>") |
Cam lung și monoton, nu?
Împărțirea în funcții
Am spus că am vrea să împărțim acest cod în bucățele mai mici. O putem face oricum, dar ar fi bine ca acele bucățele să aibă totuși un sens. De data aceasta este natural să alegem o împărțire pe strofe. Fiecare strofă va fi scrisă de o bucată de cod; o astfel de bucată de cod poartă denumirea de funcție. Prezentăm noua variantă a codului și apoi vom discuta mai pe larg despre funcții (ce sunt și cum sunt create).
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 |
function strofa1() { document.writeln("Gaudeamus igitur<br/>") document.writeln("Iuvenes dum sumus.<br/>") document.writeln("Post iucundam iuventutem<br/>") document.writeln("Post molestam senectutem<br/>") document.writeln("Nos habebit humus.<br/>") document.writeln("<br/>") } function strofa2() { document.writeln("Ubi sunt qui ante nos<br/>") document.writeln("In mundo fuere?<br/>") document.writeln("Vadite ad superos<br/>") document.writeln("Transite in inferos<br/>") document.writeln("Hos si vis videre.<br/>") document.writeln("<br/>") } function strofa3() { document.writeln("Vita nostra brevis est<br/>") document.writeln("Brevi finietur.<br/>") document.writeln("Venit mors velociter<br/>") document.writeln("Rapit nos atrociter<br/>") document.writeln("Nemini parcetur.<br/>") document.writeln("<br/>") } function strofa4() { document.writeln("Vivat academia!<br/>") document.writeln("Vivant professores!<br/>") document.writeln("Vivat membrum quodlibet;<br/>") document.writeln("Vivant membra quaelibet;<br/>") document.writeln("Semper sint in flore.<br/>") document.writeln("<br/>") } function strofa5() { document.writeln("Vivant omnes virgines<br/>") document.writeln("Faciles, formosae.<br/>") document.writeln("Vivant et mulieres<br/>") document.writeln("Tenerae, amabiles,<br/>") document.writeln("Bonae, laboriosae.<br/>") document.writeln("<br/>") } function strofa6() { document.writeln("Vivat et res publica<br/>") document.writeln("et qui illam regit.<br/>") document.writeln("Vivat nostra civitas,<br/>") document.writeln("Maecenatum caritas<br/>") document.writeln("Quae nos hic protegit.<br/>") document.writeln("<br/>") } function strofa7() { document.writeln("Pereat tristitia,<br/>") document.writeln("Pereant osores.<br/>") document.writeln("Pereat diabolus,<br/>") document.writeln("Quivis antiburschius<br/>") document.writeln("Atque irrisores.<br/>") } strofa1() strofa2() strofa3() strofa4() strofa5() strofa6() strofa7() |
Vedem acum șapte noi porțiuni de cod, care încep cu function. Urmează o denumire; acesta este numele funcției. Avem apoi o paranteză deschisă, urmată imediat de una închisă. Cam ciudat, dar să ignorăm acest aspect deocamdată (vom vedea în episodul următor mai multe despre aceste paranteze). După aceea avem un simplu bloc de instrucțiuni; acesta este numit corpul funcției.
Avem șapte linii care conțin numele celor șapte funcții, urmate de câte o paranteză deschisă și câte una închisă. Acestea sunt instrucțiuni prin care spunem că dorim să se execute codul corespunzător unei funcții. Ele poartă denumirea de apeluri de funcții.
Instrucțiunile din interiorul unei funcții nu se execută decât dacă funcția este apelată. Dacă am șterge liniile 63 - 69 versurile nu ar mai fi afișate. De fapt, acum putem alege ce strofe dorim să afișăm. Prin eliminarea unei linii, decidem că o anumită strofă nu trebuie afișată. Vă mai amintiți de comentarii? Putem să nu ștergem linia, ci doar să o comentăm.
Funcții apelate din funcții
Corpul funcției poate conține orice instrucțiuni, inclusiv un apel al unei alte funcții. Să presupunem că primele versuri din prima strofă sunt speciale; la fel și ultimul vers (vom vedea mai târziu de ce). Poate am dori să împărțim codul corespunzător funcției strofa1 în mai multe bucățele: primele două versuri, următoarele două și ultimul. Secțiunea corespunzătoare a codului ar putea arăta astfel:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
function strofa1inceput() { document.writeln("Gaudeamus igitur<br/>") document.writeln("Iuvenes dum sumus.<br/>") } function strofa1mijloc() { document.writeln("Post iucundam iuventutem<br/>") document.writeln("Post molestam senectutem<br/>") } function strofa1sfarsit() { document.writeln("Nos habebit humus.<br/>") } function strofa1() { strofa1inceput() strofa1mijloc() strofa1sfarsit() document.writeln("<br/>") } |
Avem acum o funcție care apelează alte trei funcții. Putem face același lucru și pentru funcțiile corespunzătoare celorlalte strofe.
Apeluri multiple
Am spus că o funcție este executată doar dacă este apelată. Dar, ce ne împiedică să o apelăm de mai multe ori? Nimic! Lăsăm nemodificate funcțiile strofa1inceput, strofa1mijloc și strofa1sfarsit, dar modificăm funcția strofa1 astfel:
1 2 3 4 5 6 7 8 |
function strofa1() { strofa1inceput() strofa1inceput() strofa1mijloc() strofa1sfarsit() strofa1sfarsit() document.writeln("<br/>") } |
Acum funcția strofa1inceput este apelată de două ori, deci va fi executată de două ori, deci primele două versuri vor fi afișate de două ori. Similar, funcția strofa1sfarsit este apelată de două ori, deci va fi și ea executată de două ori și ultimul vers va fi și el afișat de două ori.
De ce am face așa ceva? Când este cântat Gaudeamus, primele două versuri din fiecare strofă sunt repetate; la fel și ultimul vers. Deci, dacă am ales o împărțire potrivită a funcțiilor, am putut trece ușor de la poezie la cântec.
Ne putem gândi și la alte situații în care apelurile multiple ar putea fi utile. De exemplu, am putea avea un cântec cu refren. Funcția care afișează refrenul ar putea fi apelată de mai multe ori.
Va urma
În cadrul episodului următor, vom vedea că putem crea funcții puțin mai "inteligente". Nu vom avea doar o succesiune de instrucțiuni care se execută tot timpul în același fel, ci vom putea avea comportamente diferite în funcție de modul în care este apelată o funcție.