JS: constructor (property)

Where Does the Constructor Property Came From?

By spec, every function has a property key "prototype". (except Arrow Function )

• JS: prototype (property)

For user-defined function f, the value of f.prototype by default is {"constructor":f} (that is, a object with one property key "constructor", with value of the function itself).

// every function has a property key "prototype" (except arrow fuction)

function Fcon() {}

console.assert(Object.hasOwn(Fcon, "prototype"));

// its value is a object, with just 1 property
console.assert(Object.getOwnPropertyNames(Fcon.prototype).length === 1);

// the property key is the string "constructor"
console.assert(Object.hasOwn(Fcon.prototype, "constructor"));

// value of the property key "constructor" is the function
console.assert(Fcon.prototype.constructor === Fcon);

When you create a object using new as in jj = new Fcon(), the newly created object jj does not have a property key "constructor", but inherits from its parent, which is Fcon.prototype.

Let's be more precise:

1. Let there be a function Fcon, whose return value is not a object. (that is, no return statement, or explicitly return a non-object. 〔see Object Type〕)
2. The function Fcon is used with new (operator), as in jj = new Fcon() to create a object.
3. The parent of jj, has a property key "constructor".

function Fcon() {}
const jj = new Fcon();
console.assert(Object.hasOwn(jj, "constructor") === false);
console.assert(Object.hasOwn(Reflect.getPrototypeOf(jj), "constructor"));

Purpose

The constructor property is meant to let you find the creator function of a object. (but is not reliable.)

Here is a typical way constructor property is used.

// typical use of constructor property

function Fcon() {}
const jj = new Fcon();

console.assert(jj.constructor === Fcon);

Value of the Property Key "constructor"

It can be anything user sets.

Let's say you have user-created object named jj. You want to know what's the value of jj.constructor.

Normally, jj itself does not have a property key "constructor". But jj's parent object usually does.

jj's parent object, let's call it pp, may have a proprety named “constructor”, and its value, by default, is a function Fcon that created jj by jj = new Fcon();.

function Fcon() {}
const jj = new Fcon();
const pp = Reflect.getPrototypeOf(jj);

console.assert(Object.hasOwn(jj, "constructor") === false);
console.assert(Object.hasOwn(pp, "constructor"));
console.assert(pp.constructor === Fcon);

🟢 TIP: Do Not Use the Constructor Property

There's no reliable way to find a object's creator function. Because:

• The value of the property key "constructor" can be changed anytime.
• User can add/remove a property key "constructor"
• The parent object of a object can change anytime. 〔see Get Set Prototype〕
• JavaScript objects are often created without a constructor. 〔see Create Object〕

〔see What is Constructor?〕

Here is a example. Setting a parent will offset the constructor value.

// the value of the property key "constructor" is not guaranteed to be the constructor function

const jj = {};

function Fcon() {}

// set the prototype of Fcon
Fcon.prototype = jj;

const xx = new Fcon();

console.assert((xx.constructor === Fcon) === false);

Standard Object's Constructor

For JavaScript's standard objects, using the constructor property is reliable (but is not very useful other than understanding how it works)

// showing array's constructor
const aa = [];
console.assert(Object.hasOwn(aa, "constructor") === false);
console.assert(Reflect.getPrototypeOf(aa) === Array.prototype);
console.assert(Object.hasOwn(Array.prototype, "constructor"));
console.assert(Array.prototype.constructor === Array);
console.assert(Array.prototype.constructor === aa.constructor);

// showing a date object's constructor
const dd = new Date();
console.assert(Object.hasOwn(dd, "constructor") === false);
console.assert(Reflect.getPrototypeOf(dd) === Date.prototype);
console.assert(Object.hasOwn(Date.prototype, "constructor"));
console.assert(Date.prototype.constructor === Date);
console.assert(Date.prototype.constructor === dd.constructor);

// showing a function object's constructor
const ff = function () {};
console.assert(Object.hasOwn(ff, "constructor") === false);
console.assert(Reflect.getPrototypeOf(ff) === Function.prototype);
console.assert(Object.hasOwn(Function.prototype, "constructor"));
console.assert(Function.prototype.constructor === Function);
console.assert(Function.prototype.constructor === ff.constructor);

// Showing a data object's constructor
const jj = {};
console.assert(Object.hasOwn(jj, "constructor") === false);
console.assert(Reflect.getPrototypeOf(jj) === Object.prototype);
console.assert(Object.hasOwn(Object.prototype, "constructor"));
console.assert(Object.prototype.constructor === Object);
console.assert(Object.prototype.constructor === jj.constructor);

// showing a RegExp object's constructor
const rr = /x/;
console.assert(Object.hasOwn(rr, "constructor") === false);
console.assert(Reflect.getPrototypeOf(rr) === RegExp.prototype);
console.assert(Object.hasOwn(RegExp.prototype, "constructor"));
console.assert(RegExp.prototype.constructor === RegExp);
console.assert(RegExp.prototype.constructor === rr.constructor);