Veidojam OO programmu

 

Šajā rakstā es jums parādīšu, kā izveidot klases JavaScript, izmantojot visus līdz šim apgūtos jēdzienus.

Konkrēti, es gatavojos izveidot šādu mantojuma hierarhiju:

Dzīvnieks
/      \
Kaķis    putns
/     \            \
Mājas kaķis     Tīģeris     papagailis

Ir divi atslēgvārdi, kas ir būtiski OOP ar klasēm JavaScript.

Šie atslēgvārdi ir paplašināti un lieliski.

Paplašināšanas atslēgvārds ļauj man mantot no esošas klases.

Pamatojoties uz iepriekš minēto hierarhiju, es varu kodēt Dzīvnieks klasi šādi:

class Dzīvnieks {
    // ... klaes kods šeit ...
}
Tad es varu kodēt, kaķu apakšklasi, piemēram:
class Kaķis extends Dzīvnieks {
    // ... klases kods šeit ...
}

Šādi paplašinājuma atslēgvārds tiek izmantoti, lai iestatītu mantojuma attiecības.

Super atslēgvārds ļauj man “aizņemties” funkcionalitāti no super-klases, apakšklasē. Precīza darbības dinamika tiks aplūkota vēlāk.

Tagad varu sākt domāt, kā ieviest savu OOP klases hierarhiju.

Pirms es pat sāku, man jādomā par tādām lietām kā: * Kas jāiekļauj dzīvnieku bāzes klasē? Citiem vārdiem sakot, ko visas apakšklases mantos no bāzes klases? * Kādas ir specifiskās īpašības un metodes, kas atdala katru klasi no citām? *

Kad esmu to pārdomājis, es varu veidot savas klases.

Tātad, mans plāns ir šāds:

1. Dzīvnieku klases konstruktoram būs divas īpašības: krāsa un enerģija

2. Dzīvnieku klases prototipam būs trīs metodes: vaiAktīvs(), miega() un kādaKrāsa().

3. Metode vaiAktīvs() ikreiz, kad tiek palaists, samazinās enerģijas vērtību, līdz tā sasniegs 0. Metode vaiAktīvs() ziņos arī par atjaunināto enerģijas vērtību. Ja enerģija ir nulles līmenī, dzīvnieka objekts nekavējoties aizmigs, izmantojot miega () metodi, kuras pamatā ir minētais nosacījums.

4. Metode kādaKrāsa() tikai konsole reģistrēs krāsu rekvizīta vērtību.

5. Kaķis klase tiks mantota no Dzīvnieks ar papildinājumu, varLēktAugstu un varKāptKokā īpašībām, kas raksturīgas Kaķis klasei. Tam būs arī sava izdvešSkaņu() metode.

6. Putnu klase arī tiks mantota no Dzīvnieks, taču pašas specifiskās īpašības būs diezgan atšķirīgas no Kaķis. Proti, Putns klasei būs skaņas un varLidotīpašības, kā arī izdvešSkaņu metode.

7. MājasKaķis klase paplašinās Kaķis klasi, un tās īpašais īpašums būs savs mājasKaķaSkaņa. Turklāt tas ignorēs metodi izdvešškaņu() no Kaķis klases, taču tas tiks darīts interesantā veidā. Ja metode izdvešSkaņu() izsaukšanas laikā saņem vienu opcijas argumentu — iestatīts uz True, tad tā darbosies super.izdvešSkaņu() — citiem vārdiem sakot, palaidīs kodu no vecākklases (Kaķis), pievienojot console.log(this.mājasKaķaSkaņa). Faktiski tas nozīmē, ka metodei izdvešŠkaņu()MājasKaķis klases instances objektā būs divas atsevišķas darbības, pamatojoties uz to, vai mēs to nododam patiesam vai nepatiesam.

8. Arī Tīģeris klase tiks mantota no Kaķis, un tai būs savs tīģerisSkaņa rekvizīts, savukārt pārējā uzvedība būs gandrīz tāda pati kā MājasKaķis klasē.

9. Visbeidzot, Papagailis klase paplašinās Putns klasi ar savu varRunātrekvizītu un savu izdvešSkaņu() metodi, kas strādā ar diviem nosacījumiem: vienu, kas pārbauda, vai true vērtība tika nodota izdvešSkaņu izsaukšanas laikā, un otru pārbauda this.varRunāt rekvizītā saglabāto vērtību.

Tagad, kad esmu pilnībā izskaidrojis, kā vajadzētu darboties visam manas klases hierarhijas kodam, es varētu sākt to ieviest, pievienojot visas prasības kā komentārus koda struktūrā.

Šajā posmā, kad visas prasības ir ierakstītas kā komentāri, manam kodam jābūt šādam:

class Dzīvnieks {
    // constructor: krāsa, enerģija
    // irAktīvs()
        // ja enerģija > 0, enerģija -=20, console log enerģija
        // else if enerģija <= 0, gulēt()
    // gulēt()
        // enerģija += 20
        // console.log enerģija
}
class Cat extends Dzīvnieks {
    // constructor: skaņa, varLēktAugstu, varRāptiesKokā, krāsa, enerģija
    // izdvešSkaņu()
        // console.log skaņa
}
class Bird extends Dzīvnieks {
    // constructor: skaņa, varLidot, krāsa, enerģija
    // izdvešSkaņu()
        // console.log skaņa
}
class HouseCat extends kaķis {
    // constructor: mājasKaķaSkaņa, skaņa, varLēktAugstu, varRāptiesKokā, krāsa, enerģija
    // izdvešSkaņu(option)
        // if (option)
            // super.izdvešSkaņu()
        // console.log(mājasKaķaSkaņa)
}
class Tiger extends kaķis {
    // constructor: tīģeraSkaņa, skaņa, varLēktAugstu, varRāptiesKokā, krāsa, enerģija
    // izdvešSkaņu(option)
        // if (option)
            // super.izdvešSkaņu()
        // console.log(tīģeraSkaņa)
}
class Parrot extends Putns {
    // constructor: varRunāt, skaņa, varLēktAugstu, varKāptKokā, krāsa, enerģija
    // izdvešSkaņu(option)
        // if (option)
            // super.izdvešSkaņu()
        // if (varRunāt)
            // console.log("Runā!")
}

Tagad, kad esmu iekodējis savas prasības citādi tukšu klašu komentāros, varu sākt kodēt katru klasi atbilstoši savām specifikācijām.

Dzīvnieku klases kodēšana
Pirmkārt, es iekodēšu pamatklasi Animal.

class Dzīvnieks {
    constructor(krāsa = 'Dzeltens', enerģija = 100) {
        this.krāsa = krāsa;
        this.enerģija = enerģija;
    }
    irAktīvs() {
        if(this.enerģija > 0) {
            this.enerģija -= 20;
            console.log('Enerģijas līmenis krītās, pašlaik uz:', this.enerģija)
        } else if(this.enerģija == 0){
            this.gulēt();
        }
    }
    gulēt() {
        this.enerģija += 20;
        console.log('Enerģijas līmenis ceļās, pašlaik uz:', this.enerģija)
    }
    kādaKrāsa() {
        console.log(this.krāsa)
    }
}

Katram dzīvnieka objektam, neatkarīgi no tā, kurš tas ir, būs kopīgas krāsas un enerģijas īpašības.

Tagad es varu iekodēt kaķu un putnu klases:

class Kaķis extends Dzīvnieks {
    constructor(skaņa = 'murrr', varLēktAugstu = true, varKāptKokā = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varKāptKokā = varKāptKokā;
        this.varLēktAugstu = varLēktAugstu;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}


class Putns extends Dzīvnieks {
    constructor(skaņa = 'čirik', varLidot = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varLidot = varLidot;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}

Piezīme. Ja es savās apakšklasēs neizmantoju atslēgvārdu super, tad, palaižot iepriekš minēto kodu, un tiek parādīts šāds kļūdas ziņojums: Uncaught ReferenceError: pirms piekļūšanas this vai atvasinātajā klasē ir jāizsauc superkonstruktors. atgriežoties no atvasinātā konstruktora.

Un tagad es varu kodēt trīs atlikušās klases: MājasKaķis, Tīģeris un Papagailis.

class Dzīvnieks {
    constructor(krāsa = 'Dzeltens', enerģija = 100) {
        this.krāsa = krāsa;
        this.enerģija = enerģija;
    }
    irAktīvs() {
        if(this.enerģija > 0) {
            this.enerģija -= 20;
            console.log('Enerģijas līmenis krītās, pašlaik uz:', this.enerģija)
        } else if(this.enerģija == 0){
            this.gulēt();
        }
    }
    gulēt() {
        this.enerģija += 20;
        console.log('Enerģijas līmenis ceļās, pašlaik uz:', this.enerģija)
    }
    kādaKrāsa() {
        console.log(this.krāsa)
    }
}


class Kaķis extends Dzīvnieks {
    constructor(skaņa = 'murrr', varLēktAugstu = true, varKāptKokā = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varKāptKokā = varKāptKokā;
        this.varLēktAugstu = varLēktAugstu;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}


class Putns extends Dzīvnieks {
    constructor(skaņa = 'čirik', varLidot = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varLidot = varLidot;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}


class MājasKaķis extends Kaķis {
    constructor(mājasKaķaSkaņa = "mjau", skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija) {
        super(skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija);
        this.mājasKaķaSkaņa = mājasKaķaSkaņa;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        console.log(this.mājasKaķaSkaņa);
    }
}


class Tīģeris extends Kaķis {
    constructor(tīģeraSkaņa = "Ravrrr!", skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija) {
        super(skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija);
        this.tīģeraSkaņa = tīģeraSkaņa;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        console.log(this.tīģeraSkaņa);
    }
}


class Papagailis extends Putns {
    constructor(varRunāt = false, skaņa,varLidot, krāsa,enerģija) {
        super(skaņa,varLidot, krāsa,enerģija);
        this.varRunāt = varRunāt;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        if (this.varRunāt) {
            console.log("Esmu runājošs papagailis");
        }
    }
}

Tagad, kad esam izveidojuši visu šo mantojuma struktūru, mēs varam būvēt dažādus dzīvnieku objektus.

Piemēram, es varu uzbūvēt divus papagaiļus: vienu, kas prot runāt, un otru, kas neprot.

class Dzīvnieks {
    constructor(krāsa = 'Dzeltens', enerģija = 100) {
        this.krāsa = krāsa;
        this.enerģija = enerģija;
    }
    irAktīvs() {
        if(this.enerģija > 0) {
            this.enerģija -= 20;
            console.log('Enerģijas līmenis krītās, pašlaik uz:', this.enerģija)
        } else if(this.enerģija == 0){
            this.gulēt();
        }
    }
    gulēt() {
        this.enerģija += 20;
        console.log('Enerģijas līmenis ceļās, pašlaik uz:', this.enerģija)
    }
    kādaKrāsa() {
        console.log(this.krāsa)
    }
}


class Kaķis extends Dzīvnieks {
    constructor(skaņa = 'murrr', varLēktAugstu = true, varKāptKokā = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varKāptKokā = varKāptKokā;
        this.varLēktAugstu = varLēktAugstu;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}


class Putns extends Dzīvnieks {
    constructor(skaņa = 'čirik', varLidot = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varLidot = varLidot;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}


class MājasKaķis extends Kaķis {
    constructor(mājasKaķaSkaņa = "mjau", skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija) {
        super(skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija);
        this.mājasKaķaSkaņa = mājasKaķaSkaņa;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        console.log(this.mājasKaķaSkaņa);
    }
}


class Tīģeris extends Kaķis {
    constructor(tīģeraSkaņa = "Ravrrr!", skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija) {
        super(skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija);
        this.tīģeraSkaņa = tīģeraSkaņa;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        console.log(this.tīģeraSkaņa);
    }
}


class Papagailis extends Putns {
    constructor(varRunāt = false, skaņa,varLidot, krāsa,enerģija) {
        super(skaņa,varLidot, krāsa,enerģija);
        this.varRunāt = varRunāt;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        if (this.varRunāt) {
            console.log("Esmu runājošs papagailis");
        }
    }
}


var pollijs = new Papagailis(true); // šis tiek cauri konstruktoram ar TRUE, tāpēc Pollijs var runāt
var mollijs = new Papagailis(false); // šis tiek cauri konstruktoram ar FALSE tāpēc mollijs


pollijs.izdvešSkaņu(); // 'Čirik', 'Esmu runājošs papagailis!'
mollijs.izdvešSkaņu(); // 'Čirik'


pollijs.krāsa; // Dzeltens
mollijs.enerģija; // 100


pollijs.irAktīvs(); // Enerģija krītās, pašlaik uz: 80


var pingvīns = new Putns("Ššširiks", false, "melns ar baltu", 200); // iestatam visus noteiktos iestatījumus
pingvīns; // Putns {krāsa: 'melns ar baltu', enerģija: 200, skaņa: 'Ššširiks', varLidot: false }


pingvīns.skaņa; // 'Ššširiks'
pingvīns.varLidot; // false
pingvīns.krāsa; // 'melns ar baltu'
pingvīns.enerģija; // 200
pingvīns.irAktīvs(); //  Enerģija krītās, pašlaik uz: 180
Tāpat es varu izveidot jaunu mājas kaķi:
var leo = new Mājas kaķis();
Tagad man ir arī Leo Murr Mjau:
// Leo, tagad nemurrā lūdzu:
leo.izdvešSkaņu(false); // mjau


// Leo dara abus tagad, murrā un ņaud:
leo.izdvešSkaņu(true); // murr, ņau
Uzbūvējam mīļo tīģeri:
// Mīļš tīģerēns:
varmīļš = newTiger();
Mans izveidotais tīģeris var murrāt un uzrūkt ja nepieciešams:
// Mīļš tīģerēns:
var mīļš = new Tiger();
mīļš.izdvešSkaņu(false); // Ravrrr!
mīļš.izdvešSkaņu(true); // murr, ravrrr!
Un lūk arī pilns uzrakstītais kods:
class Dzīvnieks {
    constructor(krāsa = 'Dzeltens', enerģija = 100) {
        this.krāsa = krāsa;
        this.enerģija = enerģija;
    }
    irAktīvs() {
        if(this.enerģija > 0) {
            this.enerģija -= 20;
            console.log('Enerģijas līmenis krītās, pašlaik uz:', this.enerģija)
        } else if(this.enerģija == 0){
            this.gulēt();
        }
    }
    gulēt() {
        this.enerģija += 20;
        console.log('Enerģijas līmenis ceļās, pašlaik uz:', this.enerģija)
    }
    kādaKrāsa() {
        console.log(this.krāsa)
    }
}


class Kaķis extends Dzīvnieks {
    constructor(skaņa = 'murrr', varLēktAugstu = true, varKāptKokā = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varKāptKokā = varKāptKokā;
        this.varLēktAugstu = varLēktAugstu;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}


class Putns extends Dzīvnieks {
    constructor(skaņa = 'čirik', varLidot = true, krāsa, enerģija) {
        super(krāsa, enerģija);
        this.skaņa = skaņa;
        this.varLidot = varLidot;
    }
    izdvešSkaņu() {
        console.log(this.skaņa);
    }
}


class MājasKaķis extends Kaķis {
    constructor(mājasKaķaSkaņa = "mjau", skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija) {
        super(skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija);
        this.mājasKaķaSkaņa = mājasKaķaSkaņa;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        console.log(this.mājasKaķaSkaņa);
    }
}


class Tīģeris extends Kaķis {
    constructor(tīģeraSkaņa = "Ravrrr!", skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija) {
        super(skaņa,varLēktAugstu,varKāptKokā, krāsa,enerģija);
        this.tīģeraSkaņa = tīģeraSkaņa;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        console.log(this.tīģeraSkaņa);
    }
}


class Papagailis extends Putns {
    constructor(varRunāt = false, skaņa,varLidot, krāsa,enerģija) {
        super(skaņa,varLidot, krāsa,enerģija);
        this.varRunāt = varRunāt;
    }
    izdvešSkaņu(option) {
        if (option) {
            super.izdvešSkaņu();
        }
        if (this.varRunāt) {
            console.log("Esmu runājošs papagailis");
        }
    }
}


var pollijs = new Papagailis(true); // šis tiek cauri konstruktoram ar TRUE, tāpēc Pollijs var runāt
var mollijs = new Papagailis(false); // šis tiek cauri konstruktoram ar FALSE tāpēc mollijs


pollijs.izdvešSkaņu(); // 'Čirik', 'Esmu runājošs papagailis!'
mollijs.izdvešSkaņu(); // 'Čirik'


pollijs.krāsa; // Dzeltens
mollijs.enerģija; // 100


pollijs.irAktīvs(); // Enerģija krītās, pašlaik uz: 80


var pingvīns = new Putns("Ššširiks", false, "melns ar baltu", 200); // iestatam visus noteiktos iestatījumus
pingvīns; // Putns {krāsa: 'melns ar baltu', enerģija: 200, skaņa: 'Ššširiks', varLidot: false }


pingvīns.skaņa; // 'Ššširiks'
pingvīns.varLidot; // false
pingvīns.krāsa; // 'melns ar baltu'
pingvīns.enerģija; // 200
pingvīns.irAktīvs(); //  Enerģija krītās, pašlaik uz: 180


var leo = new MājasKaķis(); // izveidots jauns mājas kaķis Leo


// Leo, tagad nemurrā lūdzu:
leo.izdvešSkaņu(false); // mjau


// Leo dara abus tagad, murrā un ņaud:
leo.izdvešSkaņu(true); // murr, ņau


// Mīļš tīģerēns:
var mīļš = new Tiger();
mīļš.izdvešSkaņu(false); // Ravrrr!
mīļš.izdvešSkaņu(true); // murr, ravrrr!

Loading

Noderīgs raksts? Dalies ar citiem:
Dalīties: