JS: Property Key "constructor"

By Xah Lee. Date: . Last updated: .

Where Does the Constructor Property Came From?

By spec, every function has a property key "prototype".

〔►see JS: Property Key "prototype"

ECMAScript 2015 §ECMAScript Language: Functions and Classes#sec-function-definitions-runtime-semantics-evaluation

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).

ECMAScript 2015 §Ordinary and Exotic Objects Behaviours#sec-makeconstructor

// every function has a property key "prototype"
function FF() {};
console.log (
); // true

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

// the property key is "constructor"
console.log (
FF.prototype.hasOwnProperty ( "constructor" )
); // true

// value of the property key "constructor" is the function
console.log (
 FF.prototype.constructor === FF
); // true

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

Let's be more precise:

  1. Let there be a function FF, whose return value is not a object. (that is, no return statement, or returns a non-object. 〔►see JS: What's Object?〕)
  2. The function FF is used with new, as in var jj = new FF(…) to create a object.
  3. The parent of jj, has a property key "constructor".
function FF(){};
var jj = new FF();
console.log (jj.hasOwnProperty("constructor")); // false
console.log (Object.getPrototypeOf(jj).hasOwnProperty("constructor")); // true

〔►see JS: Operator “new”

What's the Property "constructor" For?

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

Here's a typical way constructor property is used.

// typical use of constructor property

function FF () { };
var myObj = new FF();
console.log ( myObj.constructor === FF ); // true

What's the 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 FF that created jj by var jj = new FF();.

function FF(){};
var jj = new FF();
var pp = Object.getPrototypeOf(jj);

console.log (jj.hasOwnProperty("constructor")); // false
console.log (pp.hasOwnProperty("constructor")); // true
console.log (pp.constructor === FF); // true

Do Not Use the Constructor Property

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

  1. The value of the property key "constructor" can be set to any object.
  2. User can add or remove a property key "constructor" to any object.
  3. The parent object of a object can change anytime. (by calling Object.setPrototypeOf ( obj, parent ))
  4. JavaScript objects are typically created without a constructor. A object can be created by literal expression such as {{…}, […], /…/}, or by Object.create(). 〔►see JS: Create Object

〔►see JS: What's Constructor?

Here's a example. Setting a parent will offset the constructor value.

// the property key "constructor" is not guaranteed to be the constructor

var pp = {};

function FF() {}
FF.prototype = pp;
var xx = new FF();

console.log ( xx.constructor === FF ); // false
console.log ( xx.constructor === Object ); // true

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 a array object's constructor:

// showing array's constructor
var aa = [];
console.log ( aa.hasOwnProperty("constructor") ); // false
console.log ( Object.getPrototypeOf(aa) === Array.prototype ); // true
console.log ( Array.prototype.hasOwnProperty("constructor") ); // true
console.log ( Array.prototype.constructor === Array ); // true
console.log ( Array.prototype.constructor === aa.constructor ); // true

〔►see JS: Array Object

Showing a date object's constructor:

// showing a date object's constructor
var dd = new Date();
console.log ( dd.hasOwnProperty("constructor") ); // false
console.log ( Object.getPrototypeOf(dd) === Date.prototype ); // true
console.log ( Date.prototype.hasOwnProperty("constructor") ); // true
console.log ( Date.prototype.constructor === Date ); // true
console.log ( Date.prototype.constructor === dd.constructor); // true

〔►see JS: Date Object

Showing a function object's constructor:

// showing a function object's constructor
var ff = function () {};
console.log ( ff.hasOwnProperty("constructor") ); // false
console.log ( Object.getPrototypeOf(ff) === Function.prototype ); // true
console.log ( Function.prototype.hasOwnProperty("constructor") ); // true
console.log ( Function.prototype.constructor === Function ); // true
console.log ( Function.prototype.constructor === ff.constructor); // true

〔►see JS: Function Object

Showing a object's constructor:

// showing a literal object's constructor
var oo = {};
console.log ( oo.hasOwnProperty("constructor") ); // false
console.log ( Object.getPrototypeOf(oo) === Object.prototype ); // true
console.log ( Object.prototype.hasOwnProperty("constructor") ); // true
console.log ( Object.prototype.constructor === Object ); // true
console.log ( Object.prototype.constructor === oo.constructor ); // true

〔►see JS: Object Object

Showing a RegExp object's constructor:

// showing a RegExp object's constructor
var rr = /x/;
console.log ( rr.hasOwnProperty("constructor") ); // false
console.log ( Object.getPrototypeOf(rr) === RegExp.prototype ); // true
console.log ( RegExp.prototype.hasOwnProperty("constructor") ); // true
console.log ( RegExp.prototype.constructor === RegExp ); // true
console.log ( RegExp.prototype.constructor === rr.constructor); // true

〔►see JS: RegExp Object

What's the difference between 「typeof」, 「instanceof」, constructor property?

typeof returns the type of the object, but array, object, date, regex, etc all just return "object".

〔►see JS: Data Types

instanceof checks if a object is in the prototype chain of a function's "prototype" property's value.

〔►see JS: “instanceof” Operator

Property key "constructor" is meant to return the function that created the object.

You shoud avoid using these, because none of these are reliable.

Instead, check directly what you are looking for, by:

Check for parent object. 〔►see JS: Find Object's Prototype

Check for the exact “subtype” of a object. 〔►see JS: Determine Type of Object

Check for the exact property, own or inherited. 〔►see JS: Check Property Existence

JS Constructor Topic

  1. JS: “this” Binding
  2. JS: What's Constructor?
  3. JS: Property Key "prototype"
  4. JS: Operator “new”
  5. JS: “instanceof” Operator
  6. JS: Property Key "constructor"
Like what you read? Buy JavaScript in Depth