JavaScript is an established language but it only added support for classic object-oriented programming (OOP) in ES6.
Until it added features like class declarations, JavaScript handled OOP using a lesser-known prototype-based paradigm.
With either approach, however, you’re able to create complex applications that use object-based features.
A constructor in prototypical JavaScript looks much like any other function.
The main difference is that you’re able to use that constructor function to create objects.
What Is a Constructor in JavaScript?
Constructors are one ofthe fundamental concepts in object-oriented programming.
A constructor is a function it’s possible for you to use to create an instance of an object.
Use thenewkeyword to call the function as a constructor.
This keyword tells JavaScript to create a new instance ofStudent.
You should not call this function without thenewkeyword because thethisinside the constructor will not point to a new object.
After construction,femaleStudenthas all the properties ofStudent.
you could access and modify these properties just like you would with any other object.
Here are some important things any developer should know about working with constructors.
Using Constructors With Arguments
you might extend a constructor to receive arguments.
This is very important if youre looking to write responsive, flexible code.
For example, thefemaleStudentyou created above will have propertiesname,gender, andagewith fixed initial values.
Thankfully, JavaScript constructors can accept parameters, like any other function.
it’s possible for you to now define unique objects from the same constructor by passing in different arguments.
Arguments make constructors more flexible.
They save time and encourage clean code.
Defining Object Methods
A method is an object property that is a function.
Methods enhance your code in OOP as it adds different behaviors to your objects.
Here is an example:
The above adds the functionsayNameto the constructor.
Suppose you use this constructor to create an object that you store in a variable,femaleStudent.
To avoid this duplication, JavaScript uses the concept of prototypes.
All objects created from a constructor share the properties of its prototype.
you could add theageproperty toStudentprototype as shown below:
By doing this, all instances ofStudentwill have theageproperty.
Declaringprototype propertiesis a way to reduce duplicate code in your utility.
It makes your code as standard as possible.
But if you have many properties to add, this can be inconvenient.
As an alternative, you might contain all the properties you require in a new object.
By doing this, youll set all the properties at once.
For example:
Remember to set theconstructorproperty when setting prototypes to a new object.
you’re free to use this property to check which constructor function created an instance.
Supertypes and Inheritance
Inheritanceis a method programmers employ to reduce errors in their applications.
Its a way of sticking to theDon’t repeat yourself (DRY)principle.
Suppose you have two constructorsStudentandTeacherthat have two similar prototype properties.
Both these constructors define thesayNamemethod, identically.
To avoid this unnecessary duplication, you might create asupertype.
you’ve got the option to then removesayNamefrom both constructors.
To inherit the properties from the supertype, useObject.create().
You set the prototype of both constructors to an instance of the supertype.
In this case, we set theStudentandTeacherprototypes to an instance of IndividualDetails.
Here is it:
By doing this,StudentandTeacherinherit all the properties of the supertype,IndividualDetails.
This is how to practice DRY in OOP using supertypes.
it’s possible for you to use a constructor to create objects that share properties and methods.
it’s possible for you to also use inheritance to define object hierarchies.
In ES6, you’re free to use theclasskeyword to define classical object-oriented classes.
This version of JavaScript also supports aconstructorkeyword.