JS: Property Key "prototype"

Where Does Property Key Prototype Came Frome

Every Constructor has a magical property key "prototype", by spec.

// every constructor function has a property key "prototype"

// standard function objects
console.log(
  Function.hasOwnProperty("prototype"),
  Array.hasOwnProperty("prototype"),
  Object.hasOwnProperty("prototype"),
  Date.hasOwnProperty("prototype"),
);

// user-defined function
console.log(
  (function () {}).hasOwnProperty("prototype"),
);

// arrow function does not
console.log(
  ((x) => (x + 1)).hasOwnProperty("prototype") === false,
);

〔see Property Overview〕

〔see JS: Global Functions Without Property Key "prototype"〕

Purpose

The property key "prototype" is a mechanism for object created using Constructor to link to a parent.

// create a constructor
function FF() {}

// create a instance
const x = new FF();

// confirm the parent object is FF.prototype
console.log(Reflect.getPrototypeOf(x) === FF.prototype);

You can set a object value to prototype property

F.prototype = obj

before calling constructor, so that the newly created object's parent will be obj.

〔see Operator “new”〕

〔see Create Object with Parent X〕

Default Value of Property Key "prototype"

For user-defined function f, the value of f.prototype by default is a newly created data object {"constructor":f}.

// Default Value of Property Key "prototype"

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

// value of FF.prototype
const xx = FF.prototype;

// its value is a data object
console.log(
  Reflect.apply(
    Object.prototype.toString,
    xx,
    [],
  ) === "[object Object]",
);

// with just 1 property
console.log(
  Object.getOwnPropertyNames(xx).length === 1,
);

// the property key is "constructor"
console.log(
  xx.hasOwnProperty("constructor"),
);

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

// show its attributes
console.log(
  JSON.stringify(
    Object.getOwnPropertyDescriptor(xx, "constructor"),
  ) === `{"writable":true,"enumerable":false,"configurable":true}`,
);

// show its parent
console.log(Reflect.getPrototypeOf(xx) === Object.prototype);

〔see Property Key "constructor"〕

Builtin Function's Value of Property Key "prototype"

For any JavaScript's buildin constructor B, the value of B.prototype is a object, and the only way to express that object is just via the “prototype” property access, that is B.prototype.

For example:

• The only way to express the value Array.prototype is Array.prototype.
• The only way to express the value Object.prototype is Object.prototype.
• The only way to express the value Function.prototype is Function.prototype.

And, just like user-defined function, the following is true:

• The value Array.prototype is designed to be the parent of new Array(…).
• The value Object.prototype is designed to be the parent of new Object(…).
• The value Function.prototype is designed to be the parent of new Function(…).

For any JavaScript's buildin constructor B, the parent of new B(…) is always B.prototype. Because the value B.prototype can never change.

/*
For any JavaScript's buildin constructor B, the parent of new B(…) is always B.prototype. Because the value B.prototype can never change.
 */

console.log(
  Reflect.getPrototypeOf(new Object()) === Object.prototype,
  Reflect.getPrototypeOf(new Function()) === Function.prototype,
  Reflect.getPrototypeOf(new Array()) === Array.prototype,
  Reflect.getPrototypeOf(new Date()) === Date.prototype,
  Reflect.getPrototypeOf(new RegExp()) === RegExp.prototype,
);

Standard Constructor's Prototype Property Cannot be Changed

Standard constructor's prototype property cannot be changed, because its writable attribute is false.

Object.getOwnPropertyDescriptor(Array, "prototype").writable === false

〔see Property Attributes〕