JAVASCRIPT CONSTRUCTORS

INTRODUCTION

First of, what is a constructor? The first thing that comes into my mind is 'architects'. Maybe it is just me, but that was the first thing that popped into my mind the first time I read about JavaScript constructors. If you are new to JavaScript or you are trying to recap on what you have learnt, give this a read, or save it for later when you need it.

What does a JavaScript constructor do?

An object instance of a class is created and initialized by a constructor, which is a unique function. In JavaScript, when an object is created with the new keyword, the constructor is invoked.

A constructor's functions include creating a new object and setting values for any attributes that already exist in the object.

📌The constructor syntax:

function NameOfConstructor() {
    this.property1 = "Property1";
    this.property2 = "Property2";
    this.property3 = "Property3";
}

What Takes Place When Someone Calls A Constructor in JavaScript?

In JavaScript, when a constructor is called, the subsequent steps are executed:

📌 A new empty object gets created.

📌 The this keyword begins to refer to the new object and it becomes the current instance object.

📌 The new object is then returned as the return value of the constructor.

Since the function keyword functions just like any other function, you can use it to define a constructor. Constructors, however, follow these guidelines:

📌 Use a capital letter in the constructor name to make them stand out from other functions.

📌 The way constructors utilize this keyword varies. This is a constructor's internal reference to the new object it will generate.

📌 Constructors define properties and actions rather than returning values, in contrast to JavaScript functions.

Using a Constructor to Create New Objects

Creating an object with a constructor in JavaScript is a simple process. Here is a basic constructor that is followed by an invocation:

function Customer() {
    this.name = "Stella";
    this.gender = "Female";
    this.age = 35;
}

let femaleCustomer = new Customer();

The object produced from the Customer constructor in this example is called femaleCustomer. To invoke the function as a constructor, use the new keyword. This keyword instructs JavaScript to start a fresh Customer instance. The this inside the constructor will not point to a new object, so you should not call this function without the new keyword. femaleCustomerhas all of the customer's properties after construction. As with any other object, you may access and change these properties.

Crucial Information Regarding JavaScript Constructors

While working with constructors might be straightforward at times, it can also be very taxing. Here are some essential details regarding using constructors that every developer should be aware of.

Using Argument-Based Constructors

📌 A constructor can be extended to take parameters. If you want to develop flexible, responsive code, this is crucial.

An object will always inherit all of the properties declared in the constructor when it is created from one. For instance, the name, gender, and age properties of the female student you generated above will have fixed starting values. Although you could modify each property by hand, building a program that used numerous objects would take a lot of work.

Fortunately, constructors in JavaScript provide parameters just like any other function. The Student constructor can be modified to take two parameters:

function Student(name, gender) {
    this.name = name;
    this.gender = gender;
    this.age = 23;
}

✅ The age of every thing made using the aforementioned will be 23. If there is a property that you would like every object to have, you can create your constructor in this manner.

Specifying Object Operations

A method is a function that is an object property. In object-oriented programming, or OOP, methods improve your code by giving your objects new actions. Here's an illustration:

function Student(name, gender) {
    this.name = name;
    this.gender = gender;
    this.age = 23 ;

    this.sayName = function () {
        return `My Name is ${name}`; 
    }
}

The function sayNameis added to the constructor by the above.

Let's say you create an object with this constructor and store it in the femaleStudent variable. The code below can then be used to invoke this function:

femaleStudent.sayName()

Constructors Are Revolutionary

Constructors are an essential part of JavaScript, and creating OOP JavaScript applications requires an understanding of their capabilities. A constructor can be used to build objects with shared methods and properties. Moreover, object hierarchies can be defined using inheritance.

The class keyword in ES6 can be used to define traditional object-oriented classes. A constructor keyword is also supported by this version of JavaScript.