关于原型链的相关整理

2020-11-06  本文已影响0人  老白涮肉坊_

首先要记住:
①:__proto__constructor是对象独有的;
②:prototype 是函数独有的;
③: 函数 也是对象;
④:实例对象的 __proto__ 就是构造该实例对象的 构造函数 的原型(prototype);
原型(prototype)也是对象,它也有 __proto__;

1. 原型链是什么

简单理解来就是:
当访问对象上的一个属性时,该对象上不存在就会向它的 __proto__ 上去查找,如果它的 __proto__ 上不存在,就会向 __proto____proto__ 上去找,如此反复向上查找,直到顶端 null,如此形成一条链,这条链就叫 原型链

2. __proto__prototype 关系

__proto__:是实例对象上的 一个属性 (姑且称为隐式原型)
prototype:叫原型,是一个对象,它是构造某个 实例对象的 构造函数 的原型。

__proto__ 是构造该 实例对象 的 构造函数 的原型(prototype)

下面参照例子都是简单列出几项对比:

// prototype 是一个对象
typeof Object.prototype // 结果:'object'
typeof Array.prototype // 结果:'object'
typeof Function.prototype // 结果:'object'
typeof Number.prototype // 结果:'object'
// ···
// ···
{}.__proto__ === Object.prototype // 结果为 true
[].__proto__ === Array.prototype // 结果为 true
let num = 123
num.__proto__ === Number.prototype // 结果为 true
function fun() {}
fun.__proto__ === Function.prototype // 结果为 true
3. __proto__

原型链的极致就是 null

// prototype 是一个对象,是对象就有 __proto__ 属性
{}.__proto__ === Object.prototype
Object.prototype.__proto__ === null // 结果 true

// ---
// prototype 是一个对象,是对象就有 __proto__ 属性
[].__proto__ === Array.prototype
Array.prototype.__proto__ === Object.prototype // 结果 true
Object.prototype.__proto__ === null // 结果 true

// ---
let num = 123
num.__proto__ === Number.prototype
Number.prototype.__proto__ === Object.prototype // 结果 true
Object.prototype.__proto__ === null // 结果 true

// ---
function fun() {}
fun.__proto__ === Function.prototype
Function.prototype.__proto__ === Object.prototype // 结果 true
Object.prototype.__proto__ === null // 结果 true
4. 原型prototype

Object,Array,Number,Function 都是 函数,构造函数是一种特殊的 函数

函数上有原型,constructor,等一些列定义的属性方法。
Function 构造函数的 原型(prototype)是所有函数的 __proto__

// Object,Array,Number,Function 等都是 构造函数,函数也是对象,是对象就有 __proto__;
// __proto__ 是构造 某实例对象 的 构造函数 的原型
Object.__proto__ === Function.prototype
Array.__proto__ === Function.prototype
Number.__proto__ === Function.prototype

// Function 是一个构造函数,构造函数是一种特殊的函数。
// Function 构造函数的 原型(prototype)是所有函数的 __proto__,因此
Function.__proto__ === Function.prototype

// 下面这个不要跟上面的理解混了
Function.prototype.__proto__ === Object.prototype 

5.constructor

constructor 指向该对象的构造函数。每个对象上都有构造函数(有的 本身拥有,有的通过继承而来,继承的需通过 .proto 来表现)。

function Fun() {}
let ff = new Fun

ff.constructor === Fun // true; ff 的 constructor 通过继承而来
Fun.prototype.constructor === Fun // true
// 即
ff.__proto__.constructor === Fun //true

Fun.constructor === Function // true;Fun 的 constructor 通过继承而来
Function.prototype.constructor === Function // true

Object.prototype.constructor === Object // true
Object.constructor === Function // true;Object 的 constructor 通过继承而来

所有的 函数 和 对象,最终都是由构造函数 Function 构造而来,所以 constructor 的终点就是 Function

如果,从头理解下来的话,理论上啊,我只是说理论上应该就懂了这个关系了。
一定要多输出查看

以上皆为个人整理,如有错误,请指正,谢谢 😃

上一篇下一篇

猜你喜欢

热点阅读