Blížime sa ku koncu základov programovania. Ostáva nám naučiť sa čo sú funkcie a objekty. V ďalšej lekcii si ukážeme už aj praktické využitie JavaScriptu. Tešíte sa?
Funkcie
Funkcia vo veľa programovacích jazykoch vyzerá takto:
//definícia funkcie function addition(a, b) { return a + b; } //zavolanie funkcie var additionResult = addition(5, 2); // 7
Definícia funkcie začína kľúčovým slovom “function“, nasleduje názov funkcie a jej parametre v zátvorke oddelené čiarkou. Funkcia môže mať ľubovoľný počet parametrov. Aj nula. Parametre môžu mať ľubovoľný názov. Kľučové slovo return vracia výsledok/hodnotu funkcie. Existujú funkcie bez return, ktoré zvyčajnie niečo vykresľujú alebo robia iné výpočty. Samotné definovanie funkcie nerobí nič, musíme ju zavolať. Funkciu zavoláme tak, že napíšeme jej názov a v zátvorke jej predáme parametre. Nesmieme zabudnúť na ukončenie príkazu stredníkom ; Všimnite si, že za definíciou funkcie nemusí byť stredník. Hodnotu, ktorú vráti funkcia môžeme uložiť do premennej, alebo s ňou inak pracovať.
Načo sú dobré funkcie? Funkcie sa používajú keď potrebujeme ten istý kód spustiť viackrát. Napríklad nasledujúca funkcia toCelsius, môžeme ju použiť na viacerých miestach a nepotrebujeme si tak pamätať vzorec:
function toCelsius(fahrenheit) { return (5/9) * (fahrenheit - 32); } //Niekde chceme previesť 90 stupňov var temp90 = toCelsius(90); //Niekde inde chceme previesť 60 stupňov var temp60 = toCelsius(60);
Objekty
Na http://www.w3schools.com/js/js_objects.asp sú objekty pekne vysvetlené aj s obrázkom. Ja sa ich pokúsim vysvetliť bez obrázku.
var person = { firstName: "John", lastName: "Doe", age:50, getFullName: function() { return this.firstName + ' ' + this.lastName; } }; console.log(person.firstName); //John console.log(person.getFullName()); //John Doe
Vytvorili sme objekt s názvom person, ktorý má niekoľko atribútov. Medzi atribútmi je aj funkcia getFullName(), ktorá po zavolaní person.getFullName() vypíše “John Doe”. Všimnite si, že atribútom priraďujeme hodnotu dvojbodkou, nie rovná sa. Vo funkcii getFullName používame kľúčové slovo this. This znamená, tento objekt. This.firstName nám vráti hodnotu atribútu firstName daného objektu.
Pomocou objektov môžeme simulovať objekty reálneho sveta. Každý objekt má nejaký atribút a môže obsahovať aj funkcie.
var car = {}; //definujeme prázdny objekt car.name = 'Porsche'; //postupne objektu pridávame atribúty car.color = 'red'; car.getNameAndColor = function() { return this.color + ' ' + this.name; };
Môžeme definovať aj prázdny objekt “{}”, ktorý nemá žiadne atribúty a neskôr mu môžme atribúty pridať. Z hľadiska výkonu kódu sa to ale nevyplatí. A je dobré vopred poznať štruktúru objektu.
var car = { name: null, //null je prazdna hodnota color: null, getColorAndName: function() { return this.color + ' ' + this.name; } }; console.log(car.getColorAndName()); //null null car.name = 'Porsche'; car.color = 'red'; console.log(car.getColorAndName()); //red Porsche
Problematika objektov je široká, nám zatiaľ stačia základy. Viac o objektoch sa dočítate na w3schools alebo na Mozilla Developer Network.
Cvičenie
Funkcie: http://jsfiddle.net/elfoslav/3gwd3xa5/
Objekty: http://jsfiddle.net/elfoslav/xt227wtb/
Ako odovzdávať cvičenia? Keď sa ti zobrazí stránka s cvičením, klikni v hornom menu na “Fork”. To vytvorí tvoju kópiu cvičenia. Keď budeš chcieť spustiť kód, klikni v hornom menu na “Run”. Keď budeš mať cvičenie hotové, klikni na “Update”, to uloží tvoje cvičenie. Potom už len skopíruješ link cvičenia a odošleš mi ho do mailu. Ja ti cvičenie skontrolujem a oznámkujem.