𝗖𝗼𝗻𝘀𝘁𝗿𝘂𝗰𝘁𝗼𝗿𝘀 𝗶𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁
Het één voor één aanmaken van objecten is traag. Als je tien studenten nodig hebt met dezelfde eigenschappen, verspil je tijd door steeds dezelfde code te schrijven.
JavaScript lost dit op met constructorfuncties.
Zie een constructor als een bouwtekening. Een bouwtekening voor een huis is geen huis, maar je gebruikt het om veel huizen te bouwen.
Hoe het werkt:
Een constructor is een speciale functie. Je gebruikt het new-keyword om objecten ervan te maken.
Voorbeeld:
function Student(name, age, city) { this.name = name; this.age = age; this.city = city; }
const student1 = new Student("John", 21, "Chennai"); const student2 = new Student("David", 22, "Madurai");
Waarom dit gebruiken?
- Het bespaart tijd.
- Het voorkomt herhaling van code.
- Het creëert een standaardstructuur voor je gegevens.
De rol van this:
Binnen een constructor verwijst het woord this naar het nieuwe object dat je aan het maken bent.
Als een leraar zegt "mijn klaslokaal", verwijst het woord "mijn" naar die specifieke leraar. In code verwijst this.name naar de naam van het specifieke object dat je zojuist hebt aangemaakt.
Wat gebeurt er als je new gebruikt?
Wanneer je const emp = new Employee("John", 50000) uitvoert, vinden er vier stappen plaats:
- JavaScript maakt een leeg object aan.
- Het this-keyword verwijst naar dat nieuwe object.
- De eigenschappen worden aan het object toegevoegd.
- Het object wordt aan je geretourneerd.
Acties toevoegen:
Objecten kunnen meer dan alleen gegevens bevatten. Ze kunnen acties uitvoeren. In de programmering worden deze acties methoden genoemd.
Voorbeeld:
function Laptop(brand, ram) { this.brand = brand; this.ram = ram; this.showDetails = function() { console.log(this.brand, this.ram); }; }
Het Laptop-object bevat nu gegevens en een functie om die gegevens te tonen.
Best Practices:
- Gebruik altijd een hoofdletter voor de eerste letter van een constructor. Gebruik Student, niet student. Dit laat andere ontwikkelaars weten dat ze het new-keyword moeten gebruiken.
- Gebruik altijd het new-keyword. Als je dit vergeet, werkt de functie als een normale functie en gaat je code kapot.
Vergelijking:
Object Literals:
- Goed voor één enkel object.
- Eenvoudig en snel.
- Geen bouwtekening.
Constructorfuncties:
- Goed voor veel objecten.
- Herbruikbaar en georganiseerd.
- Maakt gebruik van een bouwtekening-aanpak.
Source: https://www.w3schools.com/js/js_object_constructors.asp Source: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor Full post: https://dev.to/annapoo/constructor-in-javascript-4nbm