JavaScript中原型和原型对象是什么

　　

JavaScript中原型和原型对象是什么?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。

理解原型

我们创建的每一个函数都有一个原型(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。看如下例子:

function 人(){ 　　} 　　时间=Person.prototype.name  & # 39; ccc # 39; 　　Person.prototype.age =18 　　时间=Person.prototype.sayName  function  () { 　　,console.log (this.name); 　　} 　　 　　var  person1 =, new 人() 　　person1.sayName(),//,,在ccc 　　 　　var  person2 =, new 人() 　　person2.sayName(),//,,在ccc 　　 　　console.log (person1.sayName ===, person2.sayName),//,,祝辞,真正的

理解原型对象

根据上面代码,看下图:

JavaScript中原型和原型对象是什么

需要理解三点:

<李>

我们只要创建了一个新的函数,就会根据一组特定的规则为该函数创建一个原型属性,指向函数的原型对象,即人(构造函数)有一个原型指针,指向Person.prototype

<李>

默认情况下,每个原型对象上都会创建一个构造函数(构造函数)属性,这个属性是一个指向原型属性所在函数的指针

<李>

每个实例的内部都有一个指针(内部属性),指向构造函数的原型对象。即person1和person2身上都有一个内部属性__proto__(在ECMAscript中管这个指针叫[[原型]],虽然在脚本中没有标准的方式访问[[原型]],但是firefox、ie, chrome都支持一个属性叫__proto__)指向人。原型

注意:person1和person2实例与构造函数之间没有直接的关系。

在之前我们提到,所有实现中无法访问到[[原型]],那我们如何知道实例和原型对象之间是否存在关系呢?这里可以通过两个方法来判断:

<李>

原型对线上的方法:isPrototypeOf(),如:<代码> console.log (Person.prototype.isPrototypeOf (person1))//?真正的

<李>

ECMAscript5中新增的一个方法:Object.getPrototypeOf(),这个方法返回[[原型]]的值。如:console.log <代码> (Object.getPrototypeOf (person1)===Person.prototype)//?真正的

实例属性与原型属性的关系

前面我们提到过,原型最初只包含构造函数属性,而该属性也是共享的,因此可以通过对象实例访问。虽然可以通过对象实例访问保存在原型中的值,但却不能通过对象实例重写原型中的值。如果我们在实例中添加了一个属性,而改属性与实例原型中的一个属性同名,那就会在实例上创建该属性并屏蔽原型中的那个属性。如下:

function 人(),{} 　　时间=Person.prototype.name “ccc"; 　　时间=Person.prototype.age  18; 　　时间=Person.prototype.sayName 函数(),{ 　　,console.log (this.name); 　　}； 　　 　　var  person1 =, new 人(); 　　var  person2 =, new 人(); 　　 　　时间=person1.name  & # 39; www # 39;,//,在person1中添加一个名字属性 　　person1.sayName(),//,,祝辞,& # 39;www # 39;——& # 39;来自实例& # 39; 　　person2.sayName(),//,,祝辞,& # 39;ccc # 39;——& # 39;来自原型& # 39; 　　 　　console.log (person1.hasOwnProperty(& # 39;名字# 39;)),//,,祝辞,真的 　　console.log (person2.hasOwnProperty(& # 39;名字# 39;)),//,,祝辞,假的 　　 　　delete  person1.name //,,祝辞,删除person1中新添加的名字属性 　　person1.sayName(),//,,祝辞& # 39;ccc # 39;——& # 39;来自原型& # 39;

我们如何判断一个属性,到底是实例上的属性还是原型上的属性?这里可以通过hasOwnProperty()方法来检测一个属性是存在于实例中还是存在于原型中。(此方法继承于对象)

下图详细分析了上面例子在不同情况下的实现与原型的关系:(省略了人构造函数的的关系)

JavaScript中原型和原型对象是什么

更简单的原型语法

我们不可能总像之前的例子一样,没添加一个属性和方法就要敲一遍,人。原型。为了减少不必要的输入,更常见的方法是像下面这样:

function 人(){} 　　Person.prototype ={ 　　,名字:& # 39;ccc # 39; 　　,年龄:18岁 　　,sayName: function  (), { 　　,console.log (this.name) 　　,} 　　}

JavaScript中原型和原型对象是什么