JavaScript is een prototype-gebaseerde taal. Laten we de definitie van prototypen in JavaScript eens uit de doeken doen.
Wanneer u begint met objectgeoriënteerd programmeren met JavaScript, zult u al snel prototypische overerving tegenkomen.
Een prototype is een lid van een object, en kan vanuit een instantie worden opgeroepen. Voordat we ons eigen prototype maken. Laten we eerst een snel voorbeeld bekijken van hoe we al met prototypen te maken hebben.
Laten we een array maken:
let x =
x.map(a => a + 1) //
x bevat een array. x is een instantie van Array. x heeft een verwijzing naar alle prototype-eigenschappen van Array. We kunnen dus bijvoorbeeld de functie Array.prototype.map() aanroepen op x
Ik begin overal prototypen te zien!
Laten we ons eigen prototype instellen:
// Creates a constructor called Country
class Country {
constructor(country) {
this.country = country
}
}// Create a new instance of Country
let sweden = new Country('Sweden')// sweden is now an object called Country
sweden // Country { country: 'Sweden' }
Nu willen we zweden hallo laten zeggen tegen de wereld. Hier komen prototypes en de prototype-keten om de hoek kijken
// Add method to the prototype of the constructor
Country.prototype.helloWorld = function() {
return `I am a country called ${this.country}`
}
Land heeft de methode halloWereld als prototype eigenschap. zweden is nog steeds hetzelfde object maar we kunnen nu verwijzen naar halloWereld.
sweden.helloWorld() // 'I am a country called Sweden'
De interpreter zoekt naar de helloWorld Als er geen verwijzingen worden gevonden zal hij beginnen omhoog te springen in de prototype keten totdat aan het verzoek is voldaan In dit geval kan helloWorld via de prototype keten worden gerelateerd aan zweden.
En als we een nieuw land maken:
let canada = new Country('Canada')
Hetzelfde geldt voor canada, de nieuwe instantie van Country heeft ook toegang tot de prototypes. Dit is hoe een prototype en de prototype-keten werken. Het werkt als een schakel tussen de functie en zijn objecten.
Ik wil het prototype van mijn constructor delen met een andere constructor?
Laten we zeggen dat we PlanetA prototype object willen toevoegen aan PlanetB
// Constructor PlanetA
class PlanetA {
constructor(instance) {
this.instance = instance
}
// prototype method
helloWorld() {
return `I am a instance called ${this.instance}`
}
}let x = new PlanetA('x')x.helloWorld() // I am a instance called x
Om de flexibiliteit van prototypische overerving te demonstreren zullen we de prototypes van onze instantie van PlanetA aan PlanetB koppelen. We kunnen Object.setPrototypeOf() gebruiken om dat te doen.
// Constructor PlanetB
class PlanetB {
constructor(instance) {
this.instance = instance
}
}let y = new PlanetB('y')Object.setPrototypeOf(y, x)y.helloWorld() // I am a instance called y
Dit was een basis introductie tot het concept van overerving in JavaScript. Het belangrijkste is te weten dat je de mogelijkheid hebt om dynamisch objecten te instantiëren zonder interne eigenschappen, maar nog steeds in staat bent om methoden op de prototype-keten te benaderen.
Er zijn meer details voor prototypen en manieren om met overerving om te gaan in JavaScript, afhankelijk van hoe je ervoor kiest om je objecten te factoriseren. Het sleutelwoord “klasse” is syntactische suiker op constructorfuncties. Er bestaat niet zoiets als klasse-erfenis in JavaScript, alleen een prototypische manier van overerving.
Ik hoop dat u dit nuttig vond en dat u zich nu meer op uw gemak voelt bij het praten over prototypen en hoe OOP werkt in JavaScript.
Geniet van uw code.