JavaScript

JavaScript je bil razvit popolnoma neodvisno od Jave, čeprav si z njo deli funkcije in strukture. Lahko komunicira s HTML kodo za animacijo strani z dinamičnim izvajanjem, za kar se tudi JavaScript uporablja; za ustvarjanje dinamičnih strani. JavaScript je vključen v HTML za izvajanje nalog, ki niso mogoče s statičnim strani.

Spletne strani niso edino mesto, kjer lahko uporabljamo JavaScript. Ta programski jezik se uporablja tudi za izdelavo namiznih in strežniških programov. Najbolj znan med temi jeziki je node.js. Najbolj uporaben metoda v JavaScript je verjetno getElementById(), kar je tudi njen namen, za spreminjanje elementa.

JavaScript Orodje za delo

Kot eden od temeljnih jezikov svetovnega spleta preprosto ne bi bil enak brez JavaScript-a. JavaScript je programski jezik na visoki ravni, ki se uporablja v sprednjem (ang. Front-end) in zalednem (ang. Back-end) spletnem razvoju. JavaScript lahko tudi uporabimo za ustvarjanje dinamičnih spletnih vsebin in aplikacij. Če ste spletni razvijalec ali delate na drugem delavnem mesu, povezanem s spletnim razvojem, boste z učenjem JavaScript pridobili konkurenčno prednost. V tej vadnici bom opisal delo z orodji kot je PHPStorm, VisualStudio Code in beležnico v katerem koli operacijskem sistemu.

Seveda je na voljo še veliko drugih orodij, kot je to WebStorm, NetBeans, Eclipse, Notepad++ itn. Integrirana razvojna okolja (IDE) (ang. Integrated Development Environments) in urejevalnik kode (CE) (ang. Code editors) so programske aplikacije, ki se uporabljajo za pisanje in urejanje kode. Tehnično bi lahko napisali kodo v urejevalniku besedila, vendar IDE in CE ponujajo dodatne funkcije, namenjene racionalizaciji postopka kodiranja. IDE imajo na splošno več funkcij kot urejevalniki kode, vendar je mogoče nekatere urejevalnike kode prilagoditi tako, da imajo podobne funkcije kot IDE. Urejevalniki kode so pogosto opremljeni s funkcijami, kot so označevanje sintakse, samodejno dokončanje in ujemanje oklepajev. IDE združuje več orodij za razvijalce v enem samem grafičnem uporabniškem vmesniku. Ta orodje običajno sestavljajo vsaj urejevalnik kode (ang. Code editor), prevajalnik (ang. Compiler) ali tolmač (ang. Interpreter) in razhroščevalnik (ang. Debugger).

Beležnica

Beležnica je preprost urejevalnik, ki je že leta stalnica operacijskega sistema Windows, ki ga mnogi od nas uporabljamo. Urejevalnik, kot je beležnica so prisotni seveda tudi v drugih operacijskih sistemih. Uporabimo ga lahko za takojšen ogled ali urejanje in vemo, da v beležnici lahko napišemo HTML dokument in praktično je zelo podobno z JavaScript. V primeru bomo napisali celoten HTML dokument z vključeno JavaScript kodo, lahko pa se uporabi samo za pisanje JS kode in takšen dokument shranimo pod .js končnico.

PHPStorm

PHPStorm je popoln za delo z Laravel, Drupal, WordPress, itn. Urejevalnik dejansko dobi našo kodo in globoko razume njeno strukturo ter podpira vse funkcije jezika JavaScript, PHP, itn. za sodobne in starejše projekte. Zagotavlja najboljše dokončanje kode, preoblikovanje, preprečevanje napak in še več. Izkoristimo lahko vrhunske front-end tehnologije, kot so HTML 5, CSS, Saas, Less, Stylus, CoffeeScript, TypeScript, Emmet in JavaScript, z razpoložljivimi refaktorji, odpravljanjem napak in testiranjem enot. Vsako spremembo si lahko takoj ogledamo v brskalniku zahvaljujoč Live Edit. Odpravimo številne rutinske naloge neposredno iz IDE, zahvaljujoč Version Control Systems, podpori za oddaljeno uvajanje, zbirkam podatkov/SQL, orodji ukazne vrstice, Docker, Composer, REST Client in številnimi drugim orodij. Vse funkcije v WebStorm so vključene v PHPStorm, poleg tega pa je dodana popolna podpora za PHP in podpora za baze podatkov SQL.

VisualStudio Code

VisualStudio Code je brezplačen urejevalnik kode, ki ga je razvil Microsoft. Kot urejevalnik kode nima vgrajenih orodij in funkcij testiranja, vendar pa je te funkcije mogoče namestiti z vtičniki (ang. Plugins) in razširitvami (ang. Extensions). VSCode se ponaša z veliko skupnostjo in močno tehnično podporo. VSCode ima dvojnik IDE, to je VisualStudio, ki je posebej cenjen kot IDE za C, C++ in C#. Vendar pa ni brezplačen in se bo začetnim JavaScript razvijalcem zdel kot nepotrebnem nakup. Dokler vas namestitev vtičnikov (ang. Plugins) ne moti, mislim, da VSCode ponuja dovolj za JavaScript razvoj.

Kako delati z JavaScript

JavaScript je zmogljiv programski jezik, ki spletnemu mestu lahko doda interaktivnost, je vsestranski in prijazen začetnikom. Ko pridobimo izkušnje bomo lahko ustvarjali igre, izdelovali 2D in 3D animacije, obsežne aplikacije, ki temeljijo na bazi podatkov in še veliko več. Sam JavaScript je kompakten, a zelo prilagodljiv, ker je prilagojen za odklep ogromno funkcij. Te funkcije so programski vmesnik (API - Application Programming Interface), dinamično ustvarjanje spletnih strani, zbiranje in upravljanje video toka iz uporabnikove spletne kamere ali generiranje 3D grafike in zvočnih vzorcev. Na voljo nam je ogromna knjižnica tretjih oseb, ki jih lahko uporabimo za HTML, za pospešitev dela gradnje spletnih mest in aplikacij.

V HTML je JavaScript koda vstavljena med oznaki <script> in </script>

<script>
    document.getElementById("imeSpremenljivke").innerHTML = "Dobrodošli v JavaScript vadnici!";
</script>
    

Stari primeri lahko uporabljajo atribut tipa <script type="text/javascript">, ki ni več potreben. JavaScript je privzeti skriptni jezik v HTML. JavaScript funkcija je blok kode, ki se lahko izvede, ko je poklicana (ko pritisnemo na gumb). V HTML dokument lahko postavimo poljubno število skriptov. Skripte lahko postavimo v <body> ali v razdelek <head> HTML strani ali v oboje.

Zunanja JavaScript datoteka

Skripte lahko postavimo tudi v zunanje datoteke, ki je izredno uporabno, če se skripta uporablja v različnih spletnih straneh. Datoteko, ki izdelamo moramo vedno shraniti pod .js končnico. Ko želimo zunanjo skripto uporabiti, vnesemo ime datoteke v atribut src oznake <script>

<script src="imeDatoteke.js"></script>
    

Referenco zunanjega skripta lahko postavimo v <head> ali <body>, kakor želimo. Skript se bo obnašal, kot da se nahaja natanko v tistem dokumentu. Zunanje skripte ne smejo vsebovati <script> oznak. Če pogledamo prednosti zunanje skripte, se kaže v ločevanju s HTML, preprostejše vzdrževanje in branje, tako HTML kot JavaScript. Predpomnjene (ang. Cached) JavaScript datoteke lahko pospešijo nalaganje spletne strani. Če želimo dodati več skriptnih datotek na eno stran, enostavno uporabimo več skriptnih oznak.

<script src="imeDatoteke1.js"></script>
<script src="imeDatoteke2.js"></script>
<script src="imeDatoteke3.js"></script>
    

Na zunanji skript se je mogoče sklicevati na tri načine:

1. S polnim URL-jem (polni spletni naslov).
2. S potjo datoteke (kot /js/).
3. Brez kakršne koli poti.

S polnim URL-jem (polni spletni naslov).

<script src="https://vadnica.si/javascript/imeSkripte.js"></script>
    

S potjo datoteke (kot /js/).

<script src="/imeMape/javascript/imeSkripte.js"></script>
    

Brez kakršne koli poti, pomeni, da datoteko shranimo na mesto, kjer se nahaja celotna spletna stran.

<script src="imeSkripte.js"></script>