Please enable Javascript to view the contents

从头学习js-1-原型与原型链

 ·  ☕ 2 分钟

这个系列是我读冴羽老师博客的感悟,
加入了个人的解读和练习题的解答

1
2
function Person() {}
let Neo = new Person()

Person 是一个构造函数
Neo是构造函数Person创建的一个实例

首先所有的函数都有一个prototype属性
Person.prototype 代表的是调用Person构造函数创建的实例的原型
(即Person.prototype是Neo的原型)

而js中的对象也有指向原型的属性 __proto__
所以 Person.prototype === Neo.__proto__

另外原型也有属性constructor可以指向其对应的构造函数
Person.prototype.constructor === Person


原型和原型链是js实现继承的基础

原型也是一个js对象,所以原型也有__proto__属性
原型对象其实是构造函数Object创建的一个实例,所以原型的__proto__指向的是Object.prototype

当在调用一个对象的属性或方法时,如果该对象没有这个属性或方法,此时会去自动找他的原型是否有,如果还是没有则会继续向原型的原型去找,不断重复直到Object.prototype.__proto__,而Object.prototype.__proto__为null(即Object.prototype 没有原型)

这个向上自动搜索父级原型的过程就是原型链的体现

即如果Neo没有toString方法,通过原型链
Neo.toString() 依然可以执行,因为Object有toString方法

换言之通过原型链Neo可以“获得”Object的所有属性和方法


我过去经常会困惑函数是个什么东西,它是怎么储存的
从变量的类型看,分为基本类型和引用类型
所以函数只能是以引用类型中的对象形式储存的

那构造函数Person也是一个对象,
它的__proto__指向了它的原型Function.prototype
(所有构造函数的上一级原型都是Function.prototype)

即:
Person.__proto__ === Function.prototype
Function.prototype.__proto__ === Object.prototype

同时构造函数Object的上一级原型也是Function.prototype

我们整理一下:

所有对象的最终原型都是 Object.prototype

函数的原型是 -> Function.prototype 的原型是 -> Object.prototype 没有原型

构造函数Object的原型是Function.prototype

1
2
3
Person.__proto__ === Function.prototype
Function.prototype.__proto__ === Object.prototype
Object.__proto__ === Function.prototype

之前看到过一个看上去很奇怪的事情,
Function.__proto__ === Function.prototype

目前可以用上面的结论解释:所有(构造)函数的上一级原型都是Function.prototype


分享

Llane00
作者
Llane00
Web Developer