Javascript Constructor

Constructor

JavaScript Constructor is an instance of a class or function. To create a Constructor Object in JS, new keyword is used, which means, a new instance of Object Type ( class or function ).

In last two articles, we have studied JavaScript Arrays and JavaScript Objects. All objects and Arrays in JS are instance of build-in Array and Object. That's why we use new keyword to declare an array or object which means a new instance of Array or Object.

user-define object type

    function Car(x,y,z){ }

Create instance of object

    let car1=new Car();
    let car2=new Car();

datatype of Car is function and datatype of car1 and car2 is Object.

Check Constructor ob Object

    let car1=new Car();
    console.log(car1,constructor.name)

Object Type

The Object Type is the function defined by declaring a function (both declaration or expression). We define a Function with parameters. Now use this keyword in function ( which refers to current object and assign properties to this. The value of this.property is parameter of function. See example

    function Car(name,model,fuel){
        this.name=name;
        this.model=model;
        this.fuel=fuel;
    }

Constructor Object using new instance

Now to create instance of object, we use new keyword. Every time we use new keyword, we are actually creating a new instance of object.

Create Instance using new

    const swift=new Car("swift","lxi","Petrol");

More Instance using new

    const baleno=new Car("baleno","alpha","Petrol");
    
    const ciaz=new Car("ciaz","alpha","Petrol");

The swift, baleno and ciaz are constructor object or instance of Car function with different properties.

Print constructor object

    const baleno=new Car("baleno","alpha","Petrol");
    
    console.log(car);
    

Check Properties

    var baleno=new Car("baleno","alpha","Petrol");
    
    console.log(`Car name is ${baleno.name}`);
    console.log(`Car model is ${baleno.model}`);
    console.log(`Car fuel is ${baleno.fuel})`;
    

Properties of constructor objects

1. All the car names are instance of the Car Function .
2. The data type of car names is an object.
3. new keyword can create instance of both functions and class in ES6.
4. Properties of each individual object can vary depends on arguments passed in new constructor.
5. To add property to parent function, i.e. Car, use prototype. Prototype properties are given to function, but can be inherited by constructor objects.

Prototype

As we already know that JavaScript is prototype based language because JavaScript supports Prototype inheritance Model. This might be difficult for Java and C++ developers to understand that how JavaScript is dynamic and supports OOPS without class.

JavaScript introduced classes in ES2015 (ECMA6). But still after adding class in JS programming, JavaScript is still prototype-based language.

Add prototype property

    Car.prototype.parent="Suzuki";
    Car.prototype.country="Japan";
    

Check prototype property

    console.log(swift.parent, swift.country);

    console.log(baleno.parent, swift.country);

Prototype property of Array

        const cars=["swift","baleno"];
        Array.prototype.id=22;
        console.log(cars.id);
    

Prototype method of Array

        const cars=["swift","baleno"];
        Array.prototype.count=function(){ return this.length };
        console.log(cars.count());
    

Prototype property of Object

        const car={name:"swift",power:90};
        Object.prototype.year=2024;
        console.log(car.year);
    

As we can see, the Prototype Property assigned to parent Car function is now also property of constructor object, i.e swift and baleno.

hasOwnProperty

country and parent are prototype properties of Car. But each car has his own properties like, name, model and fuel. This mean all cars will have five properties, name, model, fuel, country and parent. To check own property of object, use hasOwnProperty. See example

    console.log(baleno.hasOwnProperty("name"));;

        console.log(Object.hasOwn(baleno,"name"));;
    

    console.log(baleno.hasOwnProperty("parent"));;