Načrtovanje in razvoj spletnih aplikacij

Objekti in razredi v JavaScriptu

Objekti so sestavljeni podatkovni tipi v JavaScript. Objekti so kot zbirka poimenovanih vrednosti različnih tipov (lastnosti) in funkcij za delo z njimi (metode). Lastnosti so dveh vrst: poimenovane in indeksirane. Za imena lastnosti veljajo ista pravila, kot za imena spremenljivk, indeksi lastnosti pa so lahko poljubna nenegativna cela števila. Vrednosti lastnosti so lahko poljubnih tipov, lahko so tudi objekti.

Različne objekte združujemo v skupine, imenovane razredi. Kateremu razredu bo nek objekt pripadal, se odločimo že pri njegovem ustvarjanju. Kasneje ga ne moremo prestaviti v drug razred. Zgradba objektov v istem razredu je precej podobna. To pomeni, da imajo enako poimenovane lastnosti z istim pomenom, ki pa imajo običajno različne vrednosti, lahko pa tudi enake.

Ustvarjanje novih objektov nedoločenega razreda

Nov objekt nedoločenega razreda ustvarimo tako, da v zavitih oklepajih naštejemo lastnosti objekta, ki jih ločimo z vejico. Vsako lastnost opišemo tako, da napišemo njeno ime ali indeks, nato pa dvopičje, ki mu sledi vrednost lastnosti:

{ime: vrednost, indeks: vrednost, ...}

Primer definiranja objekta racunalnik, ki vsebuje nekaj podatkov o računalniku:

var racunalnik = { 
   vrsta: "namizni računalnik", 
   znamka: "PCX", 
   procesor: "Intel Core i3", 
   pomnilnik: {delovni: "8GB", graficni: "2GB"}, 
   disk: "WD 1TB SATA3",
   zaloga: 7
}

Ustvarjanje novih objektov danega razreda

Pri ustvarjanju novega objekta danega razreda potrebujemo posebno funkcijo, imenovano konstruktor. Njegovo ime je kar ime novega razreda, s stavki v telesu pa posameznim lastnostim novega objekta priredimo vrednosti, ki so lahko odvisne od parametrov konstruktorja. Do lastnosti novega objekta pridemo preko rezervirane besede this (ta objekt). Za poimenovane lastnosti uporabimo operator . ali [], za indeksirane pa operator [].

function razred(parametri) {
   this.ime = vrednost;
   this["ime"] = vrednost;
   this[indeks] = vrednost;
   ...
}

Objekt danega razreda potem ustvarimo z operatorjem new, ki mu sledi klic konstruktorja (ime razreda s parametri v oklepaju).

function racunalnik(vrsta, znamka, zaloga) {
   this.vrsta = vrsta;
   this.znamka = znamka;
   this.zaloga = zaloga;
}

var prenosnik = new racunalnik("prenosnik", "HP", 10);
var tablica = new racunalnik("tablica", "Apple", 22);

Uporaba lastnosti v izrazih

Vrednosti posameznih lastnosti danega objekta lahko uporabjamo v izrazih na podoben način, kot spremenljivke. Do poimenovane lastnosti pridemo s pomočjo operatorja . ali [], do indeksirane pa samo z operatorjem [].

objekt.ime;
objekt["ime"];
objekt[indeks];

Poglejmo si primer, kjer povečamo zalogo prenosnikov za 1, tablici v primeru, da nima navedene znamke, dodelimo ime znamke "Samsung" in izpišemo grafični pomnilnik računalnika:

++prenosnik.zaloga;

if (tablica.znamka == null) {
   tablica["znamka"] = "Samsung";
}

document.getElement.ById("primer").innerHTML = racunalnik.pomnilnik.graficni;

Dodajanje in brisanje lastnosti

Objektu lahko dodamo novo lastnost tudi potem, ko ga že ustvarimo. Objektu prenosnik želimo dodati novo lastnost dobavitelj. To storimo z enim od spodnjih stavkov:

prenosnik.dobavitelj = "Avtera d.o.o.";
prenosnik[0] = "Avtera d.o.o.";

To nima nobenega vpliva na druge objekte istega razreda, kot na primer na objekt tablica.

Obstoječo lastnost danega objekta odstranimo z operatorjem delete. Prej dodano lastnost o kraju bivanja bi zbrisali z enim od stavkov.

delete prenosnik.dobavitelj;
delete prenosnik[0];

Operator delete uporabljamo tudi za odstranjevanje globalnih spremenljivk, to so tiste spremenljivke, ki smo jih deklarirali brez rezervirane besede var.

Metode

Metoda objekta je posebna vrsta funkcije, ki preko rezervirane besede this dostopa do lastnosti objekta. Podobno kot lastnosti, moramo definirati tudi metode pri ustvarjanju objekta, lahko pa jih definiramo tudi kasneje. Za vrednost ji damo ime funkcije, ki jo želimo poklicati.

<p id="primer"></p>
<script>
   function racunalnik (vrsta, znamka, zaloga) {
      this.vrsta = vrsta;
      this.znamka = znamka;
      this.novaZaloga = function (sprememba) {
         this.novaZaloga = sprememba;
      }
   }

   var prenosnik = new racunalnik("prenosnik", "HP", 10);
   prenosnik.novaZaloga = 50;
   document.getElementById("primer").innerHTML = "Nova zaloga je " + prenosnik.novaZaloga;
</script>