原型与原型链

一、原型

prototype是构造器的一个属性。在JS中,每一个对象的构造器都有一个prototype属性。prototype在JS中用于原型继承,可以使构造器构造出来的多个对象可以共享原型的对象。其实无论使我们自己自定义的构造器还是原生的构造器都有prototype属性。

原型与原型链_第1张图片

二、原型链

JS中的对象关系是通过原型继承来实现的,而且通常原型继承有很多的层级,这些不同的层级就构成了原型链。

如图,teacher是一个构造器,teacher里有一个原型属性,就是teacher.prototype,然后定义了两个对象billtombill对象和tom对象都有一个隐式的指针,指向teacher.prototype

在JS里,函数是用来创建自定义的构造器,也就是说teacher同时还是一个函数对象,函数对象可以通过new Function来创建,也就是它是Function的一个,Function也有自己的一个prototype属性,Functionprototype属性是内置的一些属性,是引擎自身已经实现了的一些属性和方法。teacher可以通过new Function来实现,那么它也肯定有一个隐式的指针指向Functionprototype,也就是说所有创建出来的function对象,都共享了Function.prototype原型。

teacher.prototype这个对象可以通过new Object来创建,它是object对象的一个实例,共享了object.prototype的属性和方法,所有通过object创建的对象都有一个隐式的指针指向object.prototype,而object.prototype的属性和方法都是由引擎已经定义好了的。

从最原始的object.prototype到我们创建出来的bill和tom对象,他们之间创建了一种链式的关系,tom对象是以teacher.prototype为原型的,teacher.prototype又是以object.prototype为原型的,在JS里的这样的原型继承的方式就形成了一种原型链。如红线所示。那我们还可以以tom为原型创建更多的对象,那么这个原型链就更长了。那么这些原型链有什么作用呢?我们JS里的增删查改都是由原型链来完成的。

原型与原型链_第2张图片

三、原型链上的属性增删查改

1、属性查找

在JS中属性的查找会顺着原型链往上找,直到找到所要找的属性或到尽头。

  • 查找tom.name:现在tom对象本身找,找到name"Tom"
  • 查找tom.job:先在tom对象本身找,发现没有,顺着原型链找到tom._proto_所指向的Teacher.prototype,发现了job"teacher"
  • 查找tom.tostring():先在tom对象本身找,发现没有,顺着原型链找到tom._proto_所指向的Teacher.prototype,还是没发现,再顺着Teacher.prototype_proto_所指向的Object.prototype,终于发现了toString()

原型与原型链_第3张图片

2、属性修改

在JS中,我们修改对象的属性,永远是在修改对象自身的属性,不管属性的名字来源于自身还是原型链上,如果对象本身没有这个属性,则增加这个属性。

如果修改的是原型上的属性,那么通过这个原型构造出来的对象访问这个属性的时候都会变,也就是说修改了原型,会影响到所有原型构造出来的对象。

原型与原型链_第4张图片

3、属性删除

与属性修改类似(通过delete删除)

原型与原型链_第5张图片

如何判断一个属性是否来自对象本身?
//hasOwnProperty
tom.hasOwnProperty
是的话返回true,否则返回false

四、ES5中的原型继承

原型与原型链_第6张图片

原型与原型链_第7张图片

你可能感兴趣的:(javascript)