什么是原型对象?
“我们创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。”
--摘自人民邮电出版社出版的Nicholas C.Zakas著的《JavaScript高级程序设计》(第2版)
上面提到的对象,就是原型对象,它的用途是“包含可以由特定类型的所有实例共享的属性和方法”。那么怎么才能访问到它呢?按照上面的说法,每个函数都有一个prototype 指针,这个指针指向了它的原型对象,所以我们可以通过函数的prototype属性来访问函数的原型对象。
下面用程序来说明。
function SuperType(){}
document.write(SuperType.prototype);//[object Object]
可见函数SuperType的确存在一个prototype属性,其的确是指向了一个对象。但这个对象真是原型对象吗?怎么证明?上面不是说原型对象的用途是“包含可以由特定类型的所有实例共享的属性和方法”,既然如此,那我们就来看这个对象是不是真的有这个功能。
function SuperType(){}
SuperType.prototype.name = 'Sam';//在SuperType.prototype指向的对象上增加了name属性
//在SuperType.prototype指向的对象上增加了sayName方法
SuperType.prototype.sayName = function() {
document.write(this.name);
};
SuperType.prototype.setName = function(name) {
SuperType.prototype.name = name;
};
var instance1 = new SuperType();
var instance2 = new SuperType();
instance1.sayName();//Sam
instance2.sayName();//Sam
instance1.setName('Luce');
instance1.sayName();//Luce
instance2.sayName();//Luce
当实例instance1调用setName()函数更改了SuperType.prototype.name的值后,instance2.sayName()也会输出Luce,说明SuperType.prototype指向的对象的确是“包含了可以由特定类型(这里是SuperType)的所有实例所共享的属性和方法”,所以由此可以得出结论:
SuperType.prototype指向的就是SuperType的原型对象,也即是函数的prototype属性指向了函数的原型对象。
下面用程序来说明构造函数、实例和原型对象三者之间的关系。
首先是构造函数与实例之间的关系,实例就是通过调用构造函数创立的:
function SuperType(name){
this.name = name;
this.sayName = function(){
document.write(this.name);
}
}
var instance1 = new SuperType("Sam");
instance1.sayName();//Sam
var instance2 = new SuperType("Luce");
instance2.sayName();//Luce
我们在构造函数里面定义了一个name属性和一个sayName()函数,当调用new SuperType()创建实例时,就会调用构造函数SuperType创建实例对象,同时为实例对象增加一个name 属性和一个sayName()方法(也即是把this换成了实例对象(如this.name换成了instance1.name),所以每个实例的name和sayName()方法都是独立的,注意和在原型对象上定义的 区别,在原型对象上定义是共享的)。
构造函数与原型对象的关系。前面已经说过,构造函数中有一个prototype属性,该属性是一个指针,指向了它的原型对象,那原型对象呢?是不是在它里面也存在一个指针,指向构造函数呢?答案是的确如此。原型对象中有一个constructor属性,该属性指向了构造函数:
function SuperType(){}
document.write(SuperType.prototype.constructor);//function SuperType(){}
document.write(SuperType.prototype.constructor == SuperType);//true
打印SuperType.prototype.constructor,输出的是构造函数的定义,而我们知道函数名只是一个引用,其指向函数所在的地址,所以通过SuperType.prototype.constructor和SuperType的比较,返回了true,所以SuperType.prototype.constructor和SuperType一样都指向了SuperType()函数,在这里即是指向了构造函数。
最后是实例与原型对象的关系。前面的例子可以看到(最开始),实例可以访问到在原型对象上定义的属性和方法,那么我们就可以猜测,实例中肯定有一个指针指向了原型对象,的确如此,实例中有一个属性__proto__(IE中没有这个属性,所以不要在IE下测试),该属性指向了原型对象:
function SuperType(){}
var instance = new SuperType();
document.write(instance.__proto__ == SuperType.prototype);//true
SuperType.prototype指向了SuperType的原型对象,而instance.__proto__和SuperType.prototype比较返回了true,这就说明instance.__proto__也指向了SuperType的原型 对象。
以上即是JavaScript原型对象的相关信息。
- 大小: 3.1 KB
- 大小: 2.6 KB
分享到:
相关推荐
Javascript原型对象、this的5钟用法、原型继承、Caller和Callee的使用.docx
本文实例讲述了JavaScript原型对象、构造函数和实例对象功能与用法。分享给大家供大家参考,具体如下: 大家都知道,javascript中其实并没有类的概念。但是,用构造函数跟原型对象却可以模拟类的实现。在这里,就先...
主要介绍了JavaScript原型对象原理与应用,结合实例形式分析了javascript原型对象的概念、原理、使用方法及相关操作注意事项,需要的朋友可以参考下
在Javascript中,如果我们有一个对象但是又不知道它的构造函数时,如何获取它的原型对象呢? 在Chrome中或是FireFox浏览器中,我们可以直接使用对象的__proto__属性获取它的原型对象。 代码如下: <!– lang: js ...
javascript Map原型,对象,实现javascript中的Map数据类型功能
许多人对JavaScript的原型及原型链仍感到困惑,网上的文章又大多长篇大论,令读者不明觉厉。下面小编将用最简洁明了的图文介绍JavaScript的原型及原型链。
深入理解javascript原型和闭包(01)——一切都是对象 深入理解javascript原型和闭包(02)——函数和对象的关系
而Object的原型对象用Object.__proto__ = null表示原型链的最顶端,如此变形成了javascript的原型链继承,同时也解释了为什么所有的javascript对象都具有Object的基本方法。原型对象的用途是为每个实例对象存储共享...
函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的面向对象特性,如对象的私有成员与私有方法;如何应用适当的编程模式,发挥JavaScript...
函数、闭包、对象和原型等概念,以代码重用为目的的继承模式;BOM、DOM、浏览器事件、AJAX和JSON;如何实现JavaScript中缺失的面向对象特性,如对象的私有成员与私有方法;如何应用适当的编程模式,发挥JavaScript...
JavaSciptDOM基本操作,JavaScipt函数基础,JavaScipt流程语句,JavaScript变量,JavaScript数据类型,JavaScript数组,JavaScript正则表达式,JavaScript字符串函数,Window对象等图解。JS高手进阶的工具图谱
面向对象概念(对象封装,各种继承,闭包原理,this作用域等)介绍清晰易懂
原型是理解继承概念的关键, 我们将会教你如何建立原型, 如何检测一个对象是否是另外一个对象的原型, 及其 JavaScript 的模型与Java 面向对象编程之间的区别。我们同样会向你展示如何检测对象所包含的各种属性的方法...
举例说明JavaScript中的实例对象与原型对象_.docx
浅析JavaScript实现基于原型对象的“继承”.pdf
JavaScript构造函数和原型对象介绍,对于构造函数的创建以及一些简单地介绍,还有就是原型对象对于构造函数的一些补充。
李炎恢JavaScript视频教程[Avi版]中的讲义 非常好~