illustrating javascript prototype & prototype chain

2022-12-19 08:31:24

illustrating javascript prototype & prototype chain

图解 js 原型和原型链

proto & prototype

func;

// ƒ func (name) {

//   this.name = name || `default name`;

// }

// 构造函数具有一个 prototype 属性,

func.prototype;

// {constructor: ƒ}

// 构造函数的 prototype 属性指向该构造函数的原型对象,

// 该构造函数的原型对象有一个 constructor 属性指向该构造函数本身,

func.prototype.constructor;

// ƒ func (name) {

//   this.name = name || `default name`;

// }

func.prototype.constructor === func;

// true

// var funcInstance = new func();

funcInstance = new func();

// func {name: "default name"}

// 构造函数生成的实例对象具有一个 __proto__ 属性,

funcInstance.__proto__;

// {constructor: ƒ}

// 生实例对象的  __proto__ 属性指向其构造函数的原型对象,

funcInstance.__proto__ == func.prototype;

// true

// 生实例对象的没有 prototype 属性,

funcInstance.prototype;

// undefined

Function

"use strict";

/**

 *

 * @author xgqfrms

 * @license MIT

 * @copyright xgqfrms

 * @created 2020-07-18

 * @modified

 *

 * @description

 * @difficulty Easy Medium Hard

 * @complexity O(n)

 * @augments

 * @example

 * @link

 * @solutions

 *

 */

const log = console.log;

/************************************************/

Object;

// ƒ Object() { [native code] }

Object.prototype;

// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

// constructor: ƒ Object()

// hasOwnProperty: ƒ hasOwnProperty()

// isPrototypeOf: ƒ isPrototypeOf()

// propertyIsEnumerable: ƒ propertyIsEnumerable()

// toLocaleString: ƒ toLocaleString()

// toString: ƒ toString()

// valueOf: ƒ valueOf()

// __defineGetter__: ƒ __defineGetter__()

// __defineSetter__: ƒ __defineSetter__()

// __lookupGetter__: ƒ __lookupGetter__()

// __lookupSetter__: ƒ __lookupSetter__()

// get __proto__: ƒ __proto__()

// set __proto__: ƒ __proto__()

Object.__proto__;

// ƒ () { [native code] }

Object.__proto__ === Object.prototype;

// false

/************************************************/

Function;

// ƒ Function() { [native code] }

Function.prototype;

// ƒ () { [native code] }

Function.__proto__;

// ƒ () { [native code] }

Function.__proto__ === Function.prototype;

// true

/************************************************/

Object.__proto__ === Function.__proto__;

// true

/************************************************/

function func (name) {

  this.name = name || `default name`;

}

func;

// ƒ func (name) {

//    this.name = name || `default name`;

// }

func.__proto__;

// ƒ () { [native code] }

func.__proto__.constructor;

// ƒ Function() { [native code] }

func.__proto__.constructor.prototype;

// ƒ () { [native code] }

func.__proto__.prototype;

// undefined

func.__proto__.__proto__;

// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

// constructor: ƒ Object()

// hasOwnProperty: ƒ hasOwnProperty()

// isPrototypeOf: ƒ isPrototypeOf()

// propertyIsEnumerable: ƒ propertyIsEnumerable()

// toLocaleString: ƒ toLocaleString()

// toString: ƒ toString()

// valueOf: ƒ valueOf()

// __defineGetter__: ƒ __defineGetter__()

// __defineSetter__: ƒ __defineSetter__()

// __lookupGetter__: ƒ __lookupGetter__()

// __lookupSetter__: ƒ __lookupSetter__()

// get __proto__: ƒ __proto__()

// set __proto__: ƒ __proto__()

func.__proto__.__proto__.constructor;

// ƒ Object() { [native code] }

func.__proto__.__proto__.prototype;

// undefined

func.__proto__.__proto__.__proto__;

// null

/************************************************/

func.prototype;

// {constructor: ƒ}

// constructor: ƒ func(name)

// __proto__: Object

func.prototype.constructor;

// ƒ func (name) {

//    this.name = name || `default name`;

// }

func.prototype.constructor.prototype;

// {constructor: ƒ}

// constructor: ƒ func(name)

// __proto__: Object

func.prototype.prototype;

// undefined

func.prototype.__proto__;

// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

// constructor: ƒ Object()

// hasOwnProperty: ƒ hasOwnProperty()

// isPrototypeOf: ƒ isPrototypeOf()

// propertyIsEnumerable: ƒ propertyIsEnumerable()

// toLocaleString: ƒ toLocaleString()

// toString: ƒ toString()

// valueOf: ƒ valueOf()

// __defineGetter__: ƒ __defineGetter__()

// __defineSetter__: ƒ __defineSetter__()

// __lookupGetter__: ƒ __lookupGetter__()

// __lookupSetter__: ƒ __lookupSetter__()

// get __proto__: ƒ __proto__()

// set __proto__: ƒ __proto__()

func.prototype.__proto__.constructor;

// ƒ Object() { [native code] }

func.prototype.__proto__.prototype;

// undefined

func.prototype.__proto__.__proto__;

// null

/************************************************/

// compare

func.__proto__ === Function.prototype;

// true

func.__proto__ === Function.__proto__;

// true

func.__proto__ === Object.__proto__;

// true

func.prototype === Function.prototype;

// false

func.prototype === Object.prototype;

// false

func.prototype.constructor === func;

// true

Object

"use strict";

/**

 *

 * @author xgqfrms

 * @license MIT

 * @copyright xgqfrms

 * @created 2020-07-18

 * @modified

 *

 * @description

 * @difficulty Easy Medium Hard

 * @complexity O(n)

 * @augments

 * @example

 * @link

 * @solutions

 *

 */

const log = console.log;

/************************************************/

Object;

// ƒ Object() { [native code] }

Object.prototype;

// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

// constructor: ƒ Object()

// hasOwnProperty: ƒ hasOwnProperty()

// isPrototypeOf: ƒ isPrototypeOf()

// propertyIsEnumerable: ƒ propertyIsEnumerable()

// toLocaleString: ƒ toLocaleString()

// toString: ƒ toString()

// valueOf: ƒ valueOf()

// __defineGetter__: ƒ __defineGetter__()

// __defineSetter__: ƒ __defineSetter__()

// __lookupGetter__: ƒ __lookupGetter__()

// __lookupSetter__: ƒ __lookupSetter__()

// get __proto__: ƒ __proto__()

// set __proto__: ƒ __proto__()

Object.__proto__;

// ƒ () { [native code] }

Object.__proto__ === Object.prototype;

// false

/************************************************/

Function;

// ƒ Function() { [native code] }

Function.prototype;

// ƒ () { [native code] }

Function.__proto__;

// ƒ () { [native code] }

Function.__proto__ === Function.prototype;

// true

/************************************************/

Object.__proto__ === Function.__proto__;

// true

/************************************************/

var obj = {

  name: "xgqfrms",

};

obj;

// {name: "xgqfrms"}

// name: "xgqfrms"

// __proto__: Object

obj.__proto__;

// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

// constructor: ƒ Object()

// hasOwnProperty: ƒ hasOwnProperty()

// isPrototypeOf: ƒ isPrototypeOf()

// propertyIsEnumerable: ƒ propertyIsEnumerable()

// toLocaleString: ƒ toLocaleString()

// toString: ƒ toString()

// valueOf: ƒ valueOf()

// __defineGetter__: ƒ __defineGetter__()

// __defineSetter__: ƒ __defineSetter__()

// __lookupGetter__: ƒ __lookupGetter__()

// __lookupSetter__: ƒ __lookupSetter__()

// get __proto__: ƒ __proto__()

// set __proto__: ƒ __proto__()

obj.__proto__.constructor;

// ƒ Object() { [native code] }

obj.__proto__.constructor.prototype;

// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

// constructor: ƒ Object()

// hasOwnProperty: ƒ hasOwnProperty()

// isPrototypeOf: ƒ isPrototypeOf()

// propertyIsEnumerable: ƒ propertyIsEnumerable()

// toLocaleString: ƒ toLocaleString()

// toString: ƒ toString()

// valueOf: ƒ valueOf()

// __defineGetter__: ƒ __defineGetter__()

// __defineSetter__: ƒ __defineSetter__()

// __lookupGetter__: ƒ __lookupGetter__()

// __lookupSetter__: ƒ __lookupSetter__()

// get __proto__: ƒ __proto__()

// set __proto__: ƒ __proto__()

obj.__proto__.prototype;

// undefined

obj.__proto__.__proto__;

// null

obj.__proto__.__proto__.constructor;

// Uncaught TypeError: Cannot read property 'constructor' of null

obj.__proto__.__proto__.prototype;

// Uncaught TypeError: Cannot read property 'prototype' of null

obj.__proto__.__proto__.__proto__;

// Uncaught TypeError: Cannot read property '__proto__' of null

/************************************************/

obj.prototype;

// undefined



obj.prototype.constructor;

// Uncaught TypeError: Cannot read property 'constructor' of undefined

obj.prototype.constructor.prototype;

// Uncaught TypeError: Cannot read property 'constructor' of undefined

obj.prototype.prototype;

// Uncaught TypeError: Cannot read property 'prototype' of undefined

obj.prototype.__proto__;

// Uncaught TypeError: Cannot read property '__proto__' of undefined

obj.prototype.__proto__.constructor;

// Uncaught TypeError: Cannot read property '__proto__' of undefined

obj.prototype.__proto__.prototype;

// Uncaught TypeError: Cannot read property '__proto__' of undefined

obj.prototype.__proto__.__proto__;

// Uncaught TypeError: Cannot read property '__proto__' of undefined

/************************************************/

// compare

obj.__proto__ === Function.prototype;

// false

obj.__proto__ === Function.__proto__;

// false

obj.__proto__ === Object.__proto__;

// false

obj.prototype === Function.prototype;

// false

obj.prototype === Object.prototype;

// false

obj.prototype.constructor === obj;

// Uncaught TypeError: Cannot read property 'constructor' of undefined

obj.__proto__.constructor.prototype === Object.prototype;

//true

refs

illustrating javascript prototype & prototype chain

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

码农公寓

illustrating javascript prototype & prototype chain

proto & prototype

Function

Object

refs

xgqfrms 2012-2020

相关文章