In deze zelfstudie leert u met behulp van voorbeelden over de JavaScript-constructorfunctie.
In JavaScript wordt een constructorfunctie gebruikt om objecten te maken. Bijvoorbeeld,
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // create an object const person = new Person();
In het bovenstaande voorbeeld function Person()is een objectconstructorfunctie.
Om een object te maken vanuit een constructorfunctie, gebruiken we het newtrefwoord.
Opmerking : het wordt als een goede gewoonte beschouwd om de eerste letter van uw constructorfunctie met een hoofdletter te schrijven.
Maak meerdere objecten met de constructorfunctie
In JavaScript kunt u meerdere objecten maken vanuit een constructorfunctie. Bijvoorbeeld,
// constructor function function Person () ( this.name = 'John', this.age = 23, this.greet = function () ( console.log('hello'); ) ) // create objects const person1 = new Person(); const person2 = new Person(); // access properties console.log(person1.name); // John console.log(person2.name); // John
In het bovenstaande programma worden twee objecten gemaakt met dezelfde constructorfunctie.
JavaScript dit trefwoord
In JavaScript, wanneer thistrefwoord wordt gebruikt in een constructorfunctie, thisverwijst naar het object wanneer het object wordt gemaakt. Bijvoorbeeld,
// constructor function function Person () ( this.name = 'John', ) // create object const person1 = new Person(); // access properties console.log(person1.name); // John
Wanneer een object toegang heeft tot de eigenschappen, kan het dus rechtstreeks toegang krijgen tot de eigenschap als person1.name.
Parameters van JavaScript-constructorfuncties
U kunt ook een constructorfunctie maken met parameters. Bijvoorbeeld,
// constructor function function Person (person_name, person_age, person_gender) ( // assigning parameter values to the calling object this.name = person_name, this.age = person_age, this.gender = person_gender, this.greet = function () ( return ('Hi' + ' ' + this.name); ) ) // creating objects const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'female'); // accessing properties console.log(person1.name); // "John" console.log(person2.name); // "Sam"
In het bovenstaande voorbeeld hebben we argumenten doorgegeven aan de constructorfunctie tijdens het maken van het object.
const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'male');
Hierdoor kan elk object verschillende eigenschappen hebben. Zoals hierboven getoond,
console.log(person1.name); geeft John
console.log(person2.name); geeft Sam
Objecten maken: constructorfunctie versus letterlijke object
- Object Literal wordt over het algemeen gebruikt om een enkel object te maken. De constructorfunctie is handig als u meerdere objecten wilt maken. Bijvoorbeeld,
// using object literal let person = ( name: 'Sam' )
// using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person();
- Elk object gemaakt met de constructorfunctie is uniek. U kunt dezelfde eigenschappen hebben als de constructorfunctie of u kunt een nieuwe eigenschap aan een bepaald object toevoegen. Bijvoorbeeld,
// using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person(); // adding new property to person1 person1.age = 20;
Deze ageeigenschap is nu uniek voor person1bezwaar en is niet beschikbaar voor person2bezwaar.
Als een object echter wordt gemaakt met een letterlijk object, en als een variabele wordt gedefinieerd met die objectwaarde, zullen wijzigingen in de variabelewaarde het oorspronkelijke object wijzigen. Bijvoorbeeld,
// using object lateral let person = ( name: 'Sam' ) console.log(person.name); // Sam let student = person; // changes the property of an object student.name = 'John'; // changes the origins object property console.log(person.name); // John
Wanneer een object wordt gemaakt met een letterlijk object, zal elke objectvariabele die van dat object is afgeleid, fungeren als een kloon van het oorspronkelijke object. Daarom wordt elke wijziging die u in het ene object aanbrengt, ook weerspiegeld in het andere object.
Eigenschappen en methoden aan een object toevoegen
U kunt als volgt eigenschappen of methoden in een object toevoegen:
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // creating objects let person1 = new Person(); let person2 = new Person(); // adding property to person1 object person1.gender = 'male'; // adding method to person1 object person1.greet = function () ( console.log('hello'); ) person1.greet(); // hello // Error code // person2 doesn't have greet() method person2.greet();
Uitvoer
hallo Uncaught TypeError: person2.greet is geen functie
In het bovenstaande voorbeeld worden een nieuwe eigenschap genderen een nieuwe methode greet()aan het person1object toegevoegd .
Deze nieuwe eigenschap en methode wordt echter alleen toegevoegd aan person1. U heeft geen toegang tot genderof greet()van person2. Daarom geeft het programma een foutmelding wanneer we proberen toegang te krijgenperson2.greet();
Prototype van JavaScript-objecten
U kunt ook eigenschappen en methoden aan een constructorfunctie toevoegen met behulp van een prototype . Bijvoorbeeld,
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // creating objects let person1 = new Person(); let person2 = new Person(); // adding new property to constructor function Person.prototype.gender = 'Male'; console.log(person1.gender); // Male console.log(person2.gender); // Male
Ga naar JavaScript Prototype voor meer informatie over prototypes.
JavaScript ingebouwde constructeurs
JavaScript heeft ook ingebouwde constructors. Sommige ervan zijn:
let a = new Object(); // A new Object object let b = new String(); // A new String object let c = new Number(); // A new Number object let d = new Boolean(); // A new Boolean object
In JavaScript kunnen strings als objecten worden gemaakt door:
const name = new String ('John'); console.log(name); // "John"
In JavaScript kunnen getallen als objecten worden gemaakt door:
const number = new Number (57); console.log(number); // 57
In JavaScript kunnen booleans als objecten worden gemaakt door:
const count = new Boolean(true); console.log(count); // true
Opmerking : het wordt aanbevolen om primitieve gegevenstypen te gebruiken en deze op een normale manier te maken, zoals const name = 'John';, const number = 57;enconst count = true;
U mag strings, getallen en booleaanse waarden niet als objecten declareren, omdat deze het programma vertragen.
Opmerking : in JavaScript is het trefwoord classgeïntroduceerd in ES6 (ES2015) waarmee we ook objecten kunnen maken. Klassen zijn vergelijkbaar met constructorfuncties in JavaScript. Bezoek JavaScript-klassen voor meer informatie.
