JS: Prototype Tree of Standard Objects

Prototype hierarchy

Here is a diagram of JavaScript object's Prototype Hierarchy.

• 🔸Object.prototype
• ⟶🔸{…}
• ⟶🔸Function.prototype
• ⟶⟶🔸Object
• ⟶⟶🔸Function
• ⟶⟶🔸Array
• ⟶⟶🔸Date
• ⟶⟶🔸RegExp
• ⟶⟶🔸Set
• ⟶⟶🔸Map
• ⟶⟶🔸Symbol
• ⟶⟶🔸function … {…}
• ⟶⟶🔸class … {…}
• ⟶🔸Array.prototype
• ⟶⟶🔸[…]
• ⟶🔸Date.prototype
• ⟶⟶🔸new Date(…)
• ⟶🔸RegExp.prototype
• ⟶⟶🔸/…/…
• ⟶🔸Set.prototype
• ⟶⟶🔸new Set(…)
• ⟶🔸Map.prototype
• ⟶⟶🔸new Map(…)
• ⟶🔸Symbol.prototype
• ⟶⟶🔸Symbol(…)
• ⟶🔸Math
• ⟶🔸JSON

Prototype of standard objects

Parent of Functions

All function's parent is Function.prototype

/* the parent of any function is Function.prototype */

console.assert(
 [
  Object,
  Function,
  Array,
  Date,
  RegExp,
  Set,
  Map,
  Symbol,
  class {},
  function () {},
  (x) => 3,
 ].every((x) => (Reflect.getPrototypeOf(x) === Function.prototype)),
);

Parent of namespaces: Math, JSON, reflect, etc

• JS: Math (namespace)
• JS: JSON (namespace)
• JS: Reflect (namespace)

/* Parent of namespace objects */

[
 Math,
 JSON,
 Reflect,
].forEach((x) => {
 console.assert(
  Reflect.getPrototypeOf(x) === Object.prototype,
 );
});

Parent of prototype objects

/* Parent of builtin constructor object's prototype property is Object.prototype */

[
 Function.prototype,
 Array.prototype,
 Date.prototype,
 RegExp.prototype,
].forEach((x) => {
 console.assert(
  Reflect.getPrototypeOf(x) === Object.prototype,
 );
});

Each of the Function Array Date RegExp function object has a property key "prototype". [see Property Key "prototype"]

For example, you can eval the expression Array.prototype. That means, accessing a property key "prototype" from the object Array. The value of Array.prototype, is a object. There is no special syntax to express this object other than accessing property syntax such as Array.prototype.

Root Prototype of All Objects

The root of all JavaScript standard objects is Object.prototype. Itself doesn't have any parent.

/* Object.prototype doesn't have any parent */
console.assert(
  Reflect.getPrototypeOf(Object.prototype) === null,
);

Parent of user created objects

The parent of user created objects is the value of the constructor function's "prototype" property, by default.

For example

• if it's a function object, its parent is Function.prototype.
• if it's a object object, its parent is Object.prototype.
• if it's a array object, its parent is Array.prototype.
• if it's new X(), its parent is X.prototype. (normally)

/* parent of user created objects */

console.assert(
 Reflect.getPrototypeOf({}) === Object.prototype,
);

console.assert(
 Reflect.getPrototypeOf([]) === Array.prototype,
);

console.assert(
 Reflect.getPrototypeOf(/./) === RegExp.prototype,
);

console.assert(
 Reflect.getPrototypeOf(function () {}) === Function.prototype,
);

console.assert(
 Reflect.getPrototypeOf(new Date()) === Date.prototype,
);

console.assert(
 Reflect.getPrototypeOf(new Map()) === Map.prototype,
);