Tento článok je súčasťou môjho online kurzu programovania v JavaScripte. Každý sa ho môže zúčastniť, kurz je zdarma. Kto sa ešte nezaregistroval, môže tak spraviť tu: http://eepurl.com/UzefH. Kurz obsahuje teoretickú časť (články na tomto blogu) a praktickú čast (domáce úlohy zadávané emailom).
V úvodnom článku o programovaní som sľúbil, že v ďalšom článku si ukážeme kusy kódu.
Tak poďme na to. Dnes sa naučíme pojmy ako
- variable (čítaj veriebl)
- array (čítaj erej)
- string (čitaj ako vidíš)
- integer (čítaj intidžer)
- float (čítaj flout)
- boolean (čítaj búlín)
Tieto pojmy využijete takmer vo všetkých programovacích jazykoch.
Premenné (variables)
Premenné si môžete predstaviť ako úložisko dát. Do premennej môžeme uložiť text (dátový typ string), čislo (dátové typy integer, float, double), zoznam položiek (pole), funkcie, objekty a ďalšie. Premenné sa píšu anglickým názvom. Vlastne všetky programy sa píšu anglicky, aby im rozumeli programátori z celého sveta. V JavaScripte začína definícia premennej kľúčovým slovom “var” (skratka variable).
Ukážka premennej dátového typu string s názvom “name” a hodnotou ‘Peter’:
var name = 'Peter';
Ukážka premenných s názvom “carName” a “pigName”:
//string môže začínať a končiť jednoduchými uvodzovkami ' ' var carName = 'Škoda'; //alebo dvojitými uvodzovkami " " var pigName = "Miško";
Všimnite si ako sú názvy napísané. Viacslovné názvy začínajú malým písmenom, nové slovo začína veľkým. Toto sa nazýva CamelCase a je to programátorský štandard vo väčšine programovacích jazykoch. Všimnime si tiež, že deklarácia premennej končí znakom “;” nazývaný stredník (semicolon). Stredník slúži k ukončeniu príkazu.
Premenné typu string môžeme spájať s operátorom +:
var firstname = 'Peter'; var lastname = 'Pan'; var fullName = firstname + ' ' + lastname; //medzi firstname a lastname musíme pridať medzeru. fullName má hodnotu 'Peter Pan'
Premenné typu integer/float:
//integer je celé číslo var a = 6; var b = 2; var c = a + b; //8 var d = a / b; //3 var e = a * b; //12 var f = a - b; //4
//float je desatinné číslo var x = 1.5; var y = 2.23; var z = x + y; //3.73
Desatinné čísla sa píšu s bodkou, nie čiarkou ako sme zvyknutí.
Premenné typu boolean:
var isDay = true; //je deň var isNight = false; //nie je noc var hasDog = false; //nemá psíka
Premenné typu boolean majú len 2 hodnoty – “true” a “false”. Používajú sa na zistenie či je niečo pravda alebo nepravda. Všimnite si prefixu “is/has”. Je zvykom tento prefix mať v názve premennej typu boolean.
Viac o premenných sa dočítate tu.
Komentáre (comments)
V programoch sa píšu komentáre pre objasnenie, čo daný kus kódu robí. Programátor naprogramuje niečo zložité, nenapíše si k tomu komentár, lebo v danej chvíli je mu jasné čo daný kód robí. Keď sa však po pol roku k tomu kódu vráti, bude márne rozmýšľať čo tým kusom kódu pred pol rokom myslel. Preto dobrí programátori píšu komentáre. Komentáre sa tiež píšu po anglicky, len v tomto článku ich budem písať po slovensky.
Ukážka komentárov:
//toto je jednoriadkový komentár //každý riadok musí začínať s dvoma lomítkami /** toto je viacriadkový komentár začína lomítkom a dvoma hviezdičkami končí jednou hviezdičkou a jedným lomítkom */ //môžeme zakomentovať aj kusy kódu. Zakomentovaný kód bude program ignorovať. //var a = 'blabla';
Kľúčové slová (keywords)
Každý programovací jazyk má kľúčové slová. V JavaScripte je to napr “var”, “break”, “delete”,… Kľúčové slová nemôžu byť použité ako názvy premenných pretože majú definovaný svôj speciálny význam. Všetky kľúčové slová nájdete tu.
Polia (arrays)
Ak ste si predstavili pole ako rolu, tak to nie je ono. Polia slúžia v programoch na uloženie zoznamu dát. Pole je vlastne typ premennej, tak ako sme si predstavili typy string, integer, float a boolean.
Ukážka poľa v JavaScripte:
/** pole people obsahuje mená ľudí. K položkám v poli pristupujeme pomocou indexu. Polia sa indexujú od 0. */ var people = ['Jully', 'John', 'Josh', 'Marry']; var jully = people[0]; //people[0] vráti položku s indexom 0, teda 'Jully' var josh = people[2]; //people[2] vráti 'Josh' //položku v poli môžeme zmeniť people[1] = 'Joe'; //John zmeníme na Joe //prázdne pole var people2 = []; people2[0] //vráti undefined, pretože v poli na indexe 0 nič nie je. //položky do poľa pridáme pomocou funkcie push people2.push(jully, 'Julian', people[3]); // ['Jully', 'Julian', 'Marry'] //počet položiek v poli zistíme pomocou length var peopleCount = people.length; //4
S poľami sa toho dá robiť veľa. Viac sa dočítate na w3schools. Polia si precvičíme v cvičení, na konci článku.
Zaujímavosti
var name = 'Peter'; //definujeme premennú kľúčovým slovom var name = 'Jay'; //hodnotu premennej môžeme zmeniť. Premenná už existuje, píšeme ju bez var. name = []; //hodnotu premennej môžeme predefinovať
Všetky prebrané veci v tomto článku sú základné stavebné kamene každého programu.
Pôvodne som chcel prebrať viac, ale zdá sa, že už je toho v tejto lekcii dosť. V druhej lekcii si predstavíme cykly a nejaké tie ify – ďalšie základné stavebné kamene každého programu. Ak ste sa ešte nezaregistrovali do kurzu a chcete sa naučiť základy programovania, môžte sa ešte stále zaregistrovať.
Komu by nestačil tento článok, tu je pár zdrojov o JavaScripte:
- http://devel.cz/otazka/kde-se-naucit-programovat-v-javascriptu
- http://www.jakpsatweb.cz/javascript/
- http://www.w3schools.com/js/DEFAULT.asp
Cvičenia
1. úloha: http://jsfiddle.net/elfoslav/9G3xa/
2. úloha: http://jsfiddle.net/elfoslav/He9z4/
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.
Alebo jednoduchšie: Zaregistruj sa na http://www.codermania.com a prejdi si cvičenia tam. Cvičenia sa vyhodnocujú automaticky. Ak si nebudeš dať vedieť rady, je tam tlačidlo “Ask for help”. Ak nevieš po anglicky, môžeš použiť Google translator. Veľa šťastia.