JavaScript function is also a constructor?

JavaScript function is also a “constructor.” You must have heard it many times, haven’t you? Well, that is a wrong way of interpreting the JavaScript function; even though you can create an object using a function, it does not mean you can call it a constructor. Let us discuss it:

There are four ways to create an object in JavaScript, and one of them is to call a function using the ‘new.’  Consider the code,


function Dog(name, age) {
    this.name = name;
    this.age = age;
    return 99;
}

Also, there are four ways you can call a function in JavaScript. Here let us focus on calling the Dog function in two possible ways as shown below,


let a = Dog('foo', 9);
let b = new Dog('foo', 9);
 
console.log(a);
console.log(b);

Interestingly, you get two different outputs, a – 99 and b – an object with properties name and age.

By looking at the output of b, you may say that function Dog is constructing the object b, hence let us call it a “constructor.”  This statement is not entirely true because In JavaScript,

Any newly created object is linked to an existing object.

So, by definition, object b must be linked to an existing object, and here it is linked to the prototype object of function Dog.

Yes, you read it right; in JavaScript, every function (other than arrow functions) has a prototype object. So as soon as you declare a function, JavaScript creates a prototype object of that function. Let us print,


function Dog(name, age) {
    this.name = name;
    this.age = age;
    return 99;
}
console.log(Dog.prototype);

So, newly created object b is linked to the Dog’s prototype object, or in one way, you could say- Dog’s prototype object constructs object b.

I would say Dog’s prototype object is the constructor instead of the function Dog. This statement is contradicted if you do as below:

console.log(b.constructor);

What do you get as an output? Yes, I know JavaScript is mysterious in some ways 😊, so even if b.constructor points to Function Dog, I would not say Dog is the one constructing the object b. So for me, the output of b.constuctor is a bug, and it should return us Dog.prototype instead of Function Dog.

So, if I take inspiration from Kyle Simpson in saying – Dog is just a plain normal function, but when called with new, it constructs an object, almost a side effect, which we happened to assigned to b. So the call was a constructor call, but Dog is not itself a constructor.

In summary, a function constructs an object with the help of its prototype object, so more factual would be to call the prototype object as constructor instead of function itself.

Another argument I have in my support is that since an arrow function does not have a prototype object, it can be used to construct an object, and if you try to call it using new, JavaScript throws a TypeError as shown below,

Do you still see a function as a constructor? What are your thoughts? Let me know in the comments.

Let us call Dog’s prototype as constructor of object b .

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s