JavaScript nasleđivanje sa funkcijom klase

Ovde ćemo ilustrovati simulaciju nasleđivanja pomoću konstruktorskih funkcija. Najpre da napravimo funkciju klase. Ovo ne bi trebalo da nam bude problematično.

  function Robot(name)    // OSNOVNA "KLASA"
  {
    this.X = 0;
    this.Y = 0;

    this.name = name;
    this.energy = 100;

    this.charge = function() {  // metod objekta
      // ... punjenje baterije
    };

    this.move = function(mX, mY) {  // metod objekta
      // ... kretanje robota
    };
  }

Kreirali smo funkciju klase Robot(), koja obuhvata podatke i ponašanja koja ima svaki robot. Dodali smo svojstva X i Y koje označavaju poziciju robota, kao i svojstvo name i energy. Takođe smo kreirali i dva metoda charge() za punjenje baterije i move() za kretanje robota.

Sada ćemo kreirati klasu borbenog robota - Battlebot(). Borbeni robot bi trebao da može sve što i običan robot, ali uz neke izmene i dopune.

  function Battlebot(name)    // IZVEDENA "KLASA"
  {
    Robot.call(this, name);     // nasleđujemo klasu Robot

    var MAX_ENERGY = 500;       // dodajemo i neke privatne promenljive
    var ENERGY_CHUNK = 10;
    
    this.energy = MAX_ENERGY;   // zadajemo novu vrednost za svojstvo .energy

    this.charge = function() {  // pokrivamo originalni charge() metod
      if (this.energy < MAX_ENERGY) {
        this.energy += ENERGY_CHUNK;
      }
    };
    
    this.fire = function() {    // novi metod
      console.log("Destroy! Destroy!");
    };
  }

Prva stvar koju radimo u konstruktorskoj funkciji, je da pozovemo funkciju osnovne klase, tj. funkciju Robot(). Kao prvi parametar obavezno zadajemo sam objekat koji će biti prosleđen i u koji će se dodati svojstva osnovne klase, a to je objekat this. Posle zadajemo sve ostale parametre, ako ih ima, a u ovom slučaju je to naziv robota.

Onda dodajemo lokalne promenljive koje su dostupne samo funkcijama unutar funkcije Battlebot(). Kada zadamo vrednost za svojstvo koje postoji u osnovnoj klasi (u ovom slučaju energy), svojstvo će prosto dobiti novu vrednost. Ako svojstvo predstavlja referencu na funkciju (tačnije metod), kao što je slučaj sa svojstvom charge, originalna funkcija koja je deklarisana u funkciji Robot() će biti zanemarena i umesto nje će se koristiti funkcija iz klase Battlebot.

Konačno, ova klasa dodaje i svoj metod fire. Tako će borbeni robot moći da se kreće i puni bateriju (kao i svaki robot), ali i da puca - što mogu samo borbeni roboti.

Što se tiče kreiranja i korišćenja objekta, nema nikakvih iznenađenja...

  // KREIRANJE OBJEKATA
  var b = new Battlebot("Johnny5");

  // KORIŠĆENJE OBJEKATA
  b.charge();
  b.move(15, 20);
  b.fire();

Prosto kreiramo objekat b, klase Battlebot() i prosleđujemo mu ime robota. Kada koristimo našeg robota, potpuno ravnopravno možemo da pristupamo nasleđenim metodima, kao i novim.

Pogledajte kako ovo funkcioniše na primeru:

Ovaj primer samo ilustruje razlike između dva tipa konstruktorske funkcije. Napre kreiramo osnovnu klasu Robot().

  function Robot(name)    // OSNOVNA "KLASA"
  {
    return {
      X: 0,
      Y: 0,
      name: name,
      energy: 100,

      charge: function() {  // metod objekta
        // ... punjenje baterije
      },

      move: function(mX, mY) {  // metod objekta
        // ... kretanje robota
      }
    };
  }

Kreira se objektni literal, koji se odmah vraća kao rezultat funkcije. Objekat ima svojstva X, Y, name i energy, kao i dva metoda charge() i move() za kretanje robota.

Hajde da vidimo kako bismo sada napravili izvedenu klasu Battlebot().

  function Battlebot(name)    // IZVEDENA "KLASA"
  {
    var _self = Robot(name);  // _self je objekat klase Robot

    var MAX_ENERGY = 500;       // privatne promenljive su i dalje tu
    var ENERGY_CHUNK = 10;
    
    _self.energy = MAX_ENERGY;    // zadajemo novu vrednost za svojstvo .energy u objektu _self

    _self.charge = function() {   // pokrivamo originalni charge() metod
      if (this.energy < MAX_ENERGY) {
        this.energy += ENERGY_CHUNK;
      }
    };
    
    _self.fire = function() {    // novi metod
      console.log("Destroy! Destroy!");
    };
    
    return _self;  // bitna razlika - dopunjeni objekat se vraća kao rezultat
  }

Primećujemo da ova funkcija klase mnogo više podseća na "klasičnu" konstuktorsku funkciju. Najbitnije razlike su u prvom i poslednjem redu. Na početku moramo da kreiramo objekat klase koju nasleđujemo. Zatim u taj objekat dodajemo svojstva i metode koje želimo, s tim što možemo i menjati već postojeće elemente objekta. Jedino što ovde ne koristimo objekat this, već _self koji smo sami kreirali. Na kraju, tako izmenjen objekat vraćamo kao rezultat.

Kreiranje objekta je malo drugačije, a njegovo korišćenje potpuno isto (a to je i poenta svega što radimo).

  // KREIRANJE OBJEKATA
  var b = Battlebot("Johnny5");

  // KORIŠĆENJE OBJEKATA
  b.charge();
  b.move(15, 20);
  b.fire();

Znači sve je isto, s tim što se sada, kod pravljenja objekta, ne koristi operator new.

Da pogledamo i primer...

Da vidimo jednu ilustraciju problema na koji možemo da naiđemo radeći sa privatnim funkcijama i promenljivama. Pogledajte primer osnovne klase Robot.

  function Robot()  // OSNOVNA "KLASA"
  {
    var energy = 100;
    
    this.charge = function() {
      battery(1);
    };

    this.level = function() {
      console.log(energy);
    };

    function battery(num) {   // unutrašnja funkcija - privatni metod
      energy += num;
    }
  }

U ovom slučaju ne želimo da energija robota bude javno dostupna, pa je beležimo u privatnoj promenljivoj energy. Metod charge() interno poziva unutrašnju (privatnu) funkciju battery(), koja na količinu energije dodaje zadatu vrednost (vrednost može biti i negativna i u tom slučaju se energija smanjuje).

Takođe imamo i metod level() koji ispisuje trenutnu količinu energije koju robot ima. Dakle situacija je takva da u dva metoda koristimo privatnu funkciju i lokalnu promenljivu.

Pogledajte sada šta se dešava kada klasa Battlebot nasledi klasu Robot i pokuša da pristupi privatnim elementima.

  function Battlebot()    // IZVEDENA "KLASA"
  {
    Robot.call(this);

    var energy = 500;        // ovo energy nema veze sa promenljivom iz osnovne klase

    this.fire = function() {
      battery(-2);           // GREŠKA - funkcija battery ovde nije dostupna
    }
  }

U klasi Battlebot smo dodali metod fire() koji šta-god-da-radi, takođe i umanjuje ukupnu energiju robota. Ovo je slučaj kada bismo želeli da iskoristimo unutrašnju funkciju napravljnu u osnovnoj klasi. Međutim, ovako izveden metod fire() bi izazvao grešku. U izvedenoj klasi ne postoji funkcija battery() - nju mogu koristiti samo metodi iz nadklase. Zašto? Pa jednostavno - to nisu "pravi" metodi već samo anonimne funkcije koje su referencirane svojstvima. Te anonimne funkcije su preko closure mehanizma vezane za funckije i promenljive koje su definisane u okviru njihove nadfunkcije (Robot).

Ista stvar se dešava ako u podklasi definišemo novu količinu energije u promenljivoj energy. Ako bismo za borbenog robota sada pozvali metod level() koji bi trebao da nam ispiše koliko energije ima robot, dobili bismo vrednost istoimene promenljive, ali koja "postoji" unutar oblasti važenja kojoj pripada i funkcija koju referencira level.

  // KREIRANJE OBJEKATA
  var b = new Battlebot();

  // KORIŠĆENJE OBJEKATA
  b.charge();   // radi normalno, jer to je nasleđeni metod
  b.level();    // 101 - vezano je za privatnu promenljivu osnovne klase

Tako će rezultat posle jednog punjenja biti 101, a ne 501 kako smo mislili.