当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 对采用动态原型方式无法展示继承机制得思考

Javascript
JS+XML 省份和城市之间的联动实现代码
ie与firefox下的event使用说明与详细区别
Jquery 学习笔记(二)
jQuery技巧大放送 学习jquery的朋友可以看下
使用jQuery简化Ajax开发 Ajax开发入门
jQuery入门 构造函数
JavaScript iframe的相互操作浅析
JavaScript null和undefined区别分析
JavaScript 替换Html标签实现代码
jQuery 标题的自动翻转实现代码
JavaScript读取中文cookie时的乱码问题的解决方法
JavaScript 动态创建VML的方法
JavaScript Array扩展实现代码
javascript线性渐变一
javascript 线性渐变二
javascript 线性渐变三
滑动门式菜单 实现代码
extjs 学习笔记(三) 最基本的grid
javascript 操作cookies及正确使用cookies的属性
JavaScript 基础知识 被自己遗忘的

Javascript 中的 对采用动态原型方式无法展示继承机制得思考


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 82 ::
收藏到网摘: n/a

今天看书,作者讨论到能否采用动态原型方法展示继承机制,给出的答案是:不能。原因是prototype对象的唯一性。看下面代码(这段代码不正确,却值得研究)
复制代码 代码如下:

<script type="text/javascript">
function Polygon(iSides) {
this.sides = iSides;
if(typeof Polygon._initialized == "undefined") {
Polygon.prototype.getArea = function() {
return 0;
};
Polygon._initialized = true;
}
}
function Triangle(iBase,iHeight) {
Polygon.call(this,3);
this.base = iBase;
this.hei = iHeight;
if(typeof Triangle._initialized == "undefined") {
Triangle.prototype = new Polygon();
Triangle.prototype.getArea = function() {
return this.base * this.hei * 0.5;
};
Triangle._initialized = true;
}
}
var oTriangle1 = new Triangle(12,4);
alert(oTriangle1.sides);
//alert(oTriangle1.getArea());
//这句代码是无法运行的。FireBug显示oTriangle1.getArea()不是一个function

</script>

  刚开始琢磨这段代码是很奇怪,为什么不能运行呢?于是我就开始结合作者的叙述思考(作者在这段代码后面的解释很绕,不多看几遍是理解不了他在说什么的),最后终于被我想通了。
  我们已经知道,用var anObject = new aFunction()形式创建对象的过程实际上可以分为3步:
  (1)建立新对象
  (2)将该对象内置的prototype对象设置为构造函数portotype引用的那个原型对象
  (3)将该对象作为this参数调用构造函数,完成成员设置等初始化工作
  请大家注意第(2)步,原来,
复制代码 代码如下:

var oTriangle1 = new Triangle(12,4);

  这句执行时,内部执行oTriangle1.prototype = Triangle.prototype;(当然,此时Triangle.prototype对象本身也没什么实际属性和方法) 然后才继续执行直到第(3)步,运行函数体,第一次运行到
复制代码 代码如下:

Triangle.prototype = new Polygon();

但这句执行完后,oTriangle1.prototype却已经无法再赋值了(即执行不到oTriangle1.prototype = Triangle.prototype;),接下来程序执行
复制代码 代码如下:

Triangle.prototype.getArea = function() {
return this.base * this.hei * 0.5;
};

但此时却是为时已晚,oTriangle1.prototype对象是不会拥有该方法的,拥有该方法的只能是刚才new Polygon()创建的对象,于是就有了程序最后一行注释的结果了。但是接下来创建的Triangle对象却能正常运行了。请看下面代码:
代码
复制代码 代码如下:

<script type="text/javascript">
function Polygon(iSides) {
this.sides = iSides;
if(typeof Polygon._initialized == "undefined") {
Polygon.prototype.getArea = function() {
return 0;
};
Polygon._initialized = true;
}
}
function Triangle(iBase,iHeight) {
Polygon.call(this,3);
this.base = iBase;
this.hei = iHeight;
if(typeof Triangle._initialized == "undefined") {
Triangle.prototype = new Polygon();
Triangle.prototype.getArea = function() {
return this.base * this.hei * 0.5;
};
Triangle._initialized = true;
}
}
var oTriangle1 = new Triangle(12,4);
alert(oTriangle1.sides);
//alert(oTriangle1.getArea());
//这句代码是无法运行的。FireBug显示oTriangle1.getArea()不是一个function
var oTriangle2 = new Triangle(10,5);
alert(oTriangle2.sides);
//程序最终运行证明了我的理解是正确的。
alert(oTriangle2.getArea());
</script>


至于原因嘛,也就是我前面分析的,此时内部执行oTriangle2.prototype=Triangle.prototype;该原型对象被赋予了有实际属性和方法的对象引用。