Objects Flashcards
Wat zijn objecten?
Een object is een verzameling van samenhorende data en functies dat tussen accolades staat. De data worden de eigenschappen van het object genoemd. De functies opereren op deze eigenschappen en worden de methoden van het object genoemd. Samen vormen eigenschappen en methoden de leden van het object.
voorbeeld:
const john = {
// eigenschappen
firstName: ‘John’,
lastName: ‘Smith’,
birthYear: 1990,
job: ‘teacher’,
isMarried: false,
//methoden
calcAge() {
return 2020 - this.birthYear;
} };
Wat is een object literal?
Men spreekt over een object literal wanneer een object als volgt wordt gedefinieerd:
const user = {
firstName: ‘Jimmy’,
lastName: ‘Da SIlva’,
}
Hoe kan je twee objecten nesten?
const obj1 = {
// …
}
const obj2 = {
obj1,
// …
}
Er zijn twee manieren (notaties) waarop we toegang kunnen krijgen tot de leden van een object. hoe noemen deze twee notaties en wat is het verschil?
Dot notatie: obj.someName
Bracket notatie: obj[someName]
Het verschil tussen beiden is dat het bij de bracket notatie mogelijk is om eender welke expressie te plaatsen tussen de vierkante haken:
let namekey = ‘Name’;
obj[‘first’ + namekey];
obj[‘last’ + namekey];
Welke waarde krijgen we terug wanneer we een lid van een object opvragen die niet bestaat?
undefined
Soms kan het zijn dat we een methode van een object meerdere malen moeten uitvoeren zoals bijvoorbeeld:
obj.calcAge();
obj.calcAge();
obj.calcAge();
obj.calcAge();
Indien calcAge een zware operatie is, dan heeft dit negatieve gevolgen voor de performantie van het programma. Wat zou een oplossing kunnen zijn om de performantie te verbeteren?
De oplossing zou zijn om ervoor te zorgen dat de methode het resultaat van zijn berkening opslaat als eigenschap van dat object, bijvoorbeeld:
const user = {
calcAge: function () {
// age eigenschap wordt aangemaakt
this.age = 2020 - this.birthYear;
// en wordt ook meteen teruggegeven.
return this.age;
},
};
Door dit te doen moet de methode maar 1 keer worden opgeroepen en uitgevoerd. De andere keren kan gewoon de age eigenschap opgevraagd worden:
obj.calcAge();
obj.age;
obj.age;
obj.age;
Waarvoor worden factories en constructors gebruikt en wat is het verschil tussen beiden?
Zowel factories als constructors zijn functies die worden gebruikt om objecten aan te maken. Het verschil tussen beiden is de manier waarop ze een object aanmaken.
Een factory is een functie dat in zijn body een object definieert en dat object teruggeeft:
function createCircle(radius) {
return {
radius,
draw() {
console.log(“Drawing”);
},
};
}
// aanmaak van een circle object
const c1 = createCircle(5);
Een constructor functie is een functie dat eigenschappen en methoden toevoegd aan een leeg object door gebruik te maken van this:
function Circle(radius) {
this.radius = radius;
this.draw = function () {
console.log(“Drawing”);
};
}
// aanmaak van een circle object
const c2 = new Circle(5);
Merk op dat bij constructors het new keyword gebruikt wordt om een object aan te maken.
Een ander verschil is dat de namen van constructors beginnen met een hoofdletter.
Wanneer een object wordt aangemaakt met een constructor dan zal het new keyword worden gebruikt. Wat doet new?
new zal:
- een nieuw leeg object aanmaken
- De this waarde van de constructor functie koppelen aan het adres van dit nieuwe object.
- Het kopieert de waarde van de prototype eigenschap van de constructor, naar de [[ Prototype ]] eigenschap van het nieuwe aangemaakte object, m.a.w.:
obj.[[ Prototype ]] = ConstFunc.prototype - De operand van new wordt geëvalueerd. Deze evaluatie resulteert in een oproep van de constructor functie waardoor het object geïnitialiseerd wordt.
- Het resulataat van deze evaluatie wordt dan teruggegeven. Normaal is dit het geïnitialiseerde object, tenzij dat de constructor een ander object teruggeeft in zijn body.
Elk object in javascript (ook functies want deze zijn achter de schermen ook objecten) bezit een constructor eigenschap. Wat geeft deze constructor eigenschap terug?
De constructor functie van het object.
Stel dat je twee objecten c1 en c2 hebt waarbij object c1 is aangemaakt door de factory createCircle en object c2 is aangemaakt door de constructor Circle. Wat is dan het resultaat van volgende expressies?
- c1.constructor;
- c2.constructor;
Verklaar je antwoord.
- Object() { [native code] }
- Circle(radius){}
Het resultaat van de eerste expressie geeft niet de factory functie terug maar wel de ingebouwde Object constructor. Deze constructor is ingebouwd in javascript en wordt gebruikt wanneer we een object literal definieren. Omdat we dergelijke definitie ook gebruiken in de body van een factory, zal de Object constructor worden gebruikt om het object aan te maken. Dit is ook waarom deze constructor wordt teruggegeven.
Het resultaat van de tweede expressie geeft gewoonweg de zelfgedefinieerd constructor terug.
Met welke loop kunnen we doorheen de key-value paren van een object itereren? Geef een voorbeeld van hoe we zowel de keys als hun bijhorende values kunnen printen in de console.
Dit kan met de for-in loop, bijvoorbeeld
const person = new Person();
// print alle keys en values
for (let key in person) {
console.log(key, person[key]);
}
gegeven is het volgend object: const person = new Person();
Wat is de returnwaarde van de volgende expressies?
- Object.keys(person);
- Object.values(person);
- Object.entries(person);
- Een array van keys
- Een array van waarden
- Een array van key-value paren
Waarvoor en hoe wordt de if-in statement gebruikt.
Met de if-in statement kan nagegaan worden of een object een bepaalde key bezit. als dat het geval is dan zal de body van de if-in worden uitgevoerd. bijvoorbeeld:
if(‘firstName’ in person){
console.log(person has a first name);
}
Geef drie manieren hoe we de leden van een object kunnen kopieren in een ander object.
- Door te itereren doorheen het object met de for in loop en gaandeweg de key value paren van het ene object kopieren in de andere, bijvoorbeeld:
// leden van object circle worden gekopieerd in object another
for (let key in circle) {
another[key] = circle[key];
}
- Door gebruik te maken van Object.assign, bijvoorbeeld:
Object.assign(another, circle);
- Door gebruik te maken van de spread operator, bijvoorbeeld:
const another = {
…circle,
}
- Wat zijn private leden van een object?
- Hoe kan je een lid privaat maken in een constructor functie?
- Zijn private data en functies ook eigenschappen en methoden?
- In welk geval is het goed om private leden te definiëren?
- Private leden zijn leden die enkel toegankelijk zijn voor eigenschappen en methoden binnen het object zelf. Ze hebben als het ware een lokale scope.
- Om een lid privaat te maken, moet je deze gewoon lokaal aan de constructor functie definiëren door gebruik te maken van let, const of function in plaats van this. bijvoorbeeld:
function Circle(radius){
this.radius = radius;
let defaultLocation = { x: 0, y: 0 };
function computeOptimumLocation() {
// do some
}
this.draw = function () {
// wordt opgeroepen zonder this keyword
computeOptimumLocation();
console.log(`draw`);
}; }
- Technisch gezien zijn private data geen eigenschappen en private functies geen methoden.
- Wanneer we data en methoden nodig hebben die enkel moeten dienen als hulp bij de uitvoer van een andere methode of evaluatie van een andere expressie, dan is het in dat geval beter om die hulpdata en hulpfuncties als privaat te definiëren.
