详细说明JavaScript原型对象、构造函数和实例对象的功能和用法
本文结合实例描述了JavaScript原型对象、构造函数和实例对象的功能和用法。分享给大家参考,如下:
众所周知,javascript中没有类的概念。然而,使用构造函数和原型对象可以模拟类的实现。在这里,为了便于解释,类这个词被宽松地使用。
这里有一些关于javascript构造函数、原型对象和实例对象的注释。有些错误,请改正。
首先,用一张图片简单总结一下这些之间的关系,然后提炼一下:
构造函数和实例对象
构造函数是类的外部表示,构造函数的名称通常用作类名。
事实上,构造函数是一个函数,但它与普通函数有点不同:
没有显示的创建对象;直接为此分配属性和方法;没有退货单;构造函数用于构造新的对象。如前所述,可以使用new关键字调用构造函数来创建特定类型的新对象。例如,创建对象类型的对象实例:
var o=新对象();为了区分构造函数和普通函数,通常规定构造函数的命名首字母大写,普通函数的命名首字母小写。当然,这不是必须的,但这是一个好习惯。
使用构造函数创建和初始化的属性是实例属性。所谓的实例属性意味着由这个构造函数创建的每个对象都有一个单独的实例属性副本。这些属性是通过实例访问的,它们的值取决于每个实例定义的值。如果没有在实例中定义它们,则它们是初始化构造函数时的默认值。让我们看一个例子:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;this.friends=['Tom ',' Boo '];}var p1=new Person('Lily ',20);var p2=新人(' Sam ',30);alert(P1 . name);//Lilyalert(p2 . name);//samp 1 . friends . push(' Susan ');alert(P1 . friends);//Tom,Boo,Susanalert(p2 . friends);//Tom,Boo上面的例子定义了一个Person构造函数,并初始化了三个属性:姓名、年龄和好友。然后,创建两个实例对象,即p1和p2。看这个例子,每个属性都是自己拥有的,相互之间没有影响。这是因为每个实例对象都有一个属性副本。
每个实例对象都有一个指向其构造函数的属性,这个属性就是构造函数:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;}var p1=new Person('Lily ',20);var p2=新人(' Sam ',30);alert(P1 . constructor==Person);//true alert(p2 . constructor==Person);//true构造函数有一个指向原型对象的原型属性。
原型对象和实例对象
在javascript中,每个对象都有一个与之关联的对象,这就是它的原型对象。该类的所有实例对象都从其原型对象继承属性。
原型对象是一个类的唯一标识符:当且仅当两个对象从同一个原型对象继承时,它们是同一个类的实例。
如前所述,构造函数有一个指向原型的原型属性。换句话说,对象的原型是其构造函数的prototype属性值。当定义一个函数时,它将自动创建并初始化原型值。它是一个对象,并且这个对象只有一个属性,即构造函数,它引用回与原型关联的构造函数。看一个例子:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;} alert(person . prototype);//[对象对象]警报(Person . prototype . constructor==Person);//true还可以通过原型创建属性和方法。通过原型创建的属性和方法由所有实例共享。也就是说,如果在一个实例中修改了属性或方法的值,所有其他实例的属性或方法的值都将受到影响:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;} person . prototype . friends=[' Tom ',' Sam '];var p1=新人(' Lily ',24);var p2=新人(' Susan ',20);alert(P1 . friends);//Tom,Samalert(p2 . friends);//Tom,samp 1 . friends . push(' Bill ');alert(P1 . friends);//Tom,Sam,bilalert(p2 . friends);//Tom,Sam,Bill从上面的例子可以看出,原型定义的属性是所有实例共享的。一个朋友被添加到p1,这导致这个朋友被添加到p2。
其实在很多情况下,这种现象并不是我们想要看到的。那么什么时候应该用构造函数初始化属性和方法,什么时候应该用原型对象定义它们呢?
一般建议在构造函数中定义一个通用成员,即它的值在每个实例中会有所不同,尤其是以对象或数组的形式;在原型对象中,定义了所有实例共享的一些属性,也就是说,它的值在所有实例中可以是相同的属性。
使用构造函数创建实例时,实例内部还包含指向构造函数原型对象的指针。在某些浏览器中,支持属性__proto__来表示该内部指针:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;} person . prototype . SayName=function(){ alert(this . name);}var p1=new Person('Lily ',24);警报(p1。__原型_ _。say name);//function(){ alert(this . name);}警报(p1。__原型_ _。构造函数==Person);//true在ECMAscript5中,增加了一个新的方法Object.getPrototypeOf(),可以将指针的值返回到上述实例对象内部的原型:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;}var p1=new Person('Lily ',24);alert(object . getprototypeof(P1)=person . prototype);//trueisPrototypeOf()方法也可以用来确定实例对象与其原型之间的这种关系:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;}var p1=new Person('Lily ',24);alert(person . prototype . is rototype of(P1));//真实原型语法
从原型对象和实例对象以及构造函数之间的关系,我们已经知道向原型对象添加属性和方法可以定义如下:Person.prototype=name。
那么,你一定要输入Person吗?原型每次你定义一个人的属性?答案是否定的,我们也可以像创建对象一样创建原型对象:
函数People(){ } People . prototype={ name : ' Tom ',age :29 } var P1=new People();alert(P1 . name);//Tomalert(P1 . age);//29需要注意的一点是,这个方法相当于重写了整个原型对象,所以切断了它与构造函数的关系。此时,Person.prototype.constructor不再指向Person:
函数People(){ } People . prototype={ name : ' Tom ',age :29 } var P1=new People();alert(Person . prototype . constructor==Person);//false alert(person . prototype . constructor==Object);//真。因此,如果希望它再次指向“人员”,可以为显示的分配一个值:
function PeRsoN(){ } PeRsoN . prototype={ constructor : PeRsoN,name:'Tom ',age :29 } var P1=new PeRsoN();alert(Person . prototype . constructor==Person);//true alert(person . prototype . constructor==Object);//虚假摘要
最后,我们举一个例子,然后管理构造函数、原型对象和实例对象之间的关系:
函数Person(姓名、年龄){ this.name=namethis.age=年龄;} person . prototype . SayName=function(){ alert(this . name);}var p1=new Person('Tom ',20);警报(人.原型);//object alert(Person . prototype . constructor==Person);//true alert(P1 . constructor==Person);//truealert(p1。_ _ proto _ _==person . prototype);//truealert(p1。__原型_ _。_ _ proto _ _==object . prototype);//truealert(p1。__原型_ _。__原型_ _。构造函数==Object);//true alert(person . constructor==Function);//true alert(Object . prototype . constructor==Object);
上图说明了本例中原型、构造函数和实例属性之间的关系。
更多对JavaScript相关内容感兴趣的读者可以查看本网站专题:《javascript面向对象入门教程》、《JavaScript常用函数技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript数学运算用法总结》、0103010
希望本文对JavaScript编程有所帮助。
版权声明:详细说明JavaScript原型对象、构造函数和实例对象的功能和用法是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。