Extra: OOP voor 6vin2

Inloggen met Google

❗️ Voordat je start

Ga naar Replit met de volgende link:

https://replit.com/@Krisvan1/ObjectOrientedProgramming

Fork de repository. Maak eventueel een account aan als je die nog niet hebt.

Elke opdracht kan je zelf testen door op de “Run” knop te drukken.

TIP: Je kan ook checken of je opdracht echt klopt door de Unit tests te runnen. Deze vind je of recht naast je console of links onder bij Tools.

TIP: Onderaan deze pagina staat een cheat-sheet voor de syntax van JavaScript.

📦️ Classes

🗺️ UML Diagrams

Je hebt keuze! Kies uit een makkelijke of moeilijke opdracht.

Pak papier of je iPad erbij om een UML diagram te tekenen.

Oplossingen

🌳 Overerving (Inheritence)

Maak de opdrachten van de volgende replit:

https://replit.com/@Krisvan1/Inheritence#index.js

Fork de repository. Maak eventueel een account aan als je die nog niet hebt.

Elke opdracht kan je zelf testen door op de “Run” knop te drukken.

🕵️ 🥏 Inkapseling

Maak de opdrachten van de volgende replit: https://replit.com/@Krisvan1/PrivateGetSet#index.js

TIP: Gebruik de instructies om de code te testen

TIP: Gebruik het cheat sheet als je niet meer weet hoe je alles moet typen

Klaar? Ga verder met Opdracht 3 van de reguliere opdrachten:

https://informatica.emmauscollege.nl/theorie/objectoriented_verwerkingsopdrachten/#opdracht-3

🚑️ Oefenopdracht

Je gaat oefenen met alles wat je tot nu toe geleerd hebt.

Kijk je UML diagram na

Natuurlijk, laten we dat aanpakken.

🗒️ JavaScript Cheat Sheet

Creating an Object

Een object is een verzameling van sleutel-waarde paren. In dit voorbeeld bevat het object player drie sleutels: name, score en level.

var player = {
    name: 'John',
    score: 100,
    level: 2
};

Creating an Array of Objects

Arrays zijn geordende lijsten van items. Hier hebben we een array van objecten.

var players = [
    {
        name: 'John',
        score: 100,
        level: 2
    },
    {
        name: 'Jane',
        score: 150,
        level: 3
    }
];

Accessing Object Properties

Je kunt de waarde van een objecteigenschap opvragen door de naam van het object gevolgd door een punt en daarna de eigenschapsnaam.

console.log(player.name); // John

Looping Through an Array of Objects

Een for loop herhaalt een reeks instructies een bepaald aantal keer. In dit geval loopt de loop door elk object in de players array en drukt de naam en score van elke speler af.

Uitleg loop:

• i = 0: Initialiseert de tellervariabele i op 0.
• i < players.length: De loop blijft draaien zolang i kleiner is dan het aantal items in de players array.
• i++: Verhoogt de waarde van i met 1 na elke loop.

for(var i = 0; i < players.length; i++) {
    console.log(players[i].name + ' has a score of ' + players[i].score);
}

Creating a Class

Een klasse definieert de eigenschappen (variabelen) en gedragingen (methoden) die zijn objecten (instanties) zullen hebben.

class Player {
    name;
    score;
    level;
  
    constructor(name, score, level) {
        this.name = name;
        this.score = score;
        this.level = level;
    }

    increaseScore(amount) {
        this.score += amount;
    }

    increaseLevel() {
        this.level++;
    }
    
    printDetails() {
        console.log(this.name + ' has a score of ' + this.score + ' and is on level ' + this.level);
    }
}

Creating an Instance of a Class

var player1 = new Player('John', 100, 2);

Accessing Class Properties

console.log(player1.name); // John

Inheritance in JavaScript

Inheritance stelt je in staat om een nieuwe klasse te maken die is gebaseerd op een bestaande klasse. De nieuwe klasse erft eigenschappen en gedrag van de ouderklasse.

class Goalkeeper extends Player {
    savedGoals;
  
    constructor(name, score, level, savedGoals) {
        super(name, score, level);
        this.savedGoals = savedGoals;
    }

    printGoalkeeperStatistics() {
        console.log('Saved Goals: ' + this.savedGoals);
    }
}

Prive variabelen & Getters en Setters

Private variabelen (zoals #saldo) zijn alleen toegankelijk binnen de klasse waarin ze zijn gedefinieerd. Getters en Setters zijn speciale methoden die respectievelijk worden gebruikt om waarden van deze private variabelen op te vragen of in te stellen.

class BankRekening {
    #saldo; // Prive variabele
  
   constructor() {
        this.#saldo = 0;
   }

    getSaldo() {
        console.log("Saldo opvragen");
        return this.#saldo;
    }

    setSaldo(bedrag) {
        if (bedrag >= 0) {
            this.#saldo = bedrag;
        } else {
            console.log("Ongeldig saldo");
        }
    }
}

const rekening = new BankRekening();
console.log(rekening.getSaldo()); // Saldo opvragen + het huidige saldo
rekening.setSaldo(-1000); // Ongeldig saldo

Door het gebruik van getters en setters kunnen we ervoor zorgen dat de regels voor toegang tot of wijziging van data worden nageleefd.

Powerpoints

• Download hier de lespresentaties

Antwoorden oefeningen

• opdracht 1
• overerving
• private, set en get
• ziekenhuissysteem