每个函数就是一个对象#xff08;Function#xff09;#xff0c;函数对象都有一个子对象

prototype对象#xff0c;类是以函数的形式来定义的。

prototype表示该函数的原型#x…1.prototype解释

在JavaScript中prototype对象是实现面向对象的一个重要机制。

prototype对象类是以函数的形式来定义的。

prototype表示该函数的原型也表示一个类的成员的集合。

在通过new创建一个类的实例对象的时候prototype对象的成员都成为实例化对象的成员。

同时函数是一个对象函数对象若直接声明成员不用被实例化即可调用。

只有当一个对象被定义为函数对象时才拥有对prototype对象引用的prototype属性这点必须知道因为这牵涉到了new一个对象的过程中js引擎要完成对prototype进行一系列操作而普通的js对象由于并不能被new即使拥有prototype也是无意义的第二点在我之前的文章中已讨论过

改变this的引用为实例对象直接定义成员属性所以若直接在函数对象中声明成员无法被实例对象访问。

2.prototype作用

上面说了prototype的一些定义那么prototype有什么作用。

上一段落中其中解释了prototype的作用“

通过new创建一个类的实例对象时prototype对象的成员都成为实例化对象的成员”意思就是我们可以为new创建的实例对象动态添加成员变量而无需在函数对象中定义所有的属性和方法。

如下代码

function

animal(){}animal.prototype.name

animal;

通过new创建一个函数对象的实例对象时该函数对象的prototype原型对象的成员都能被实例对象访问。

之前在我的前一篇文章中《

js中this关键字探讨》就模拟了一下new一个对象的过程但是当时我们并没有涉及到prototype对象那么涉及到了prototype对象这个过程又到底是怎么实现的呢

一个函数对象被new实例化成为实例对象时可以分解为以下三步用上面的animal对象作为例子

第一步定义animalObj

每个对象都在其内部初始化一个属性就是__proto__当访问一个对象属性时如果内部不存在这就会去__proto__里找__proto__又会有自己的__proto__于是一直找下去这就是原型链的概念。

当访问animalObj

的name和move属性时animalObj并没有这些属性就会去__proto__中找在第二步中__proto__指向了animal.prototype,所以animal.prototype定义了name和move属性所以就可以访问这些属性。

那么到底怎么验证我们对于__proto__的结论呢

按照标准__proto__不对外公开是个私有属性但chrome的引擎将其暴露出来成一个共有的属性可对外访问和设置IE不能直接访问如下

animal.prototype);

总结当一个函数对象被被new为一个实例对象时函数对象的prototype对象中的属性并没有直接成为实例对象的成员属性而是成为实例对象的__proto__对象中的属性而函数对象中的成员需要使用this关键字会被改变引用直接成为实例对象的成员属性

上面说到当访问一个对象的成员属性时如果对象本身没有该属性时会去它的__proto__对象中找如果找不到继续找__proto__的__proto__对象中的属性一直往下找。

可以利用这一特性实现类似于java中的继承如下代码

动物类构造函数

animal(){}animal.prototype.name

animal;

cat.prototype,所以c.__proto__.__proto__

animal.prototype;

所以当访问c的detail时本身找不到该属性会找__proto__(即cat.prototype)中是否有该属性找到了该属性同理访问name和move属性时会继续往下遍历__proto__中是否有该属性。

这也就是原型链的实现原理。

本质上prototype只是一个假象在实现原型链中只起到辅助作用只是在new的时候有价值原型链的本质其实在于__proto__

自己搭建的租房网站全网租房助手m.kuairent.com每天新增

500房源