首页 > 代码库 > 《ext江湖》第8章继承-代码片段
《ext江湖》第8章继承-代码片段
创建Animal对象
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; }; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; var a = new Animal("蓬松的尾巴"); a.happy(); var b = new Animal("长尾巴"); b.happy(); var init = function(){};</script></head><body onload="init();"></body></html>
创建Person对象，继承Animal
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; }; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ this.name = name; }; Person.prototype=new Animal(); var p = new Person("大漠穷秋"); alert(p.tail); alert(p.name); p.happy(); p.eat(); p.run(); p.fight(); var init = function(){};</script></head><body onload="init();"></body></html>
删除Person的tail属性
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; }; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ this.name = name; }; Person.prototype=new Animal(); delete Person.prototype.tail; var p = new Person("大漠穷秋"); alert(p.tail); var init = function(){};</script></head><body onload="init();"></body></html>
重置constructor
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; }; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ this.name = name; }; Person.prototype=new Animal(); delete Person.prototype.tail; Person.prototype.constructor=Person; var p = new Person("大漠穷秋"); alert(p.constructor); alert(p.constructor==Person); var init = function(){};</script></head><body onload="init();"></body></html>
对象冒充
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; }; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ Animal.call(this); this.name = name; delete this.tail; }; var p = new Person("大漠穷秋"); alert(p.name); alert(p.tail); p.happy(); p.eat(); p.run(); p.fight(); var init = function(){};</script></head><body onload="init();"></body></html>
静态属性, undefined是正常的。
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; Animal.instanceCounter++; }; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ Person.superclass.call(this); this.name = name; }; Person.superclass = Animal; var p1 = new Person("大漠穷秋"); alert(Person.instanceCounter); var init = function(){};</script></head><body onload="init();"></body></html>
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; Animal.instanceCounter++; }; Animal.instanceCounter=0; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ Person.superclass.call(this); this.name = name; for(var p in Animal){ //不能拷贝父类的prototype上的属性 Person[p] = Animal[p]; } }; Person.superclass = Animal; var p1 = new Person("大漠穷秋"); var p2 = new Person("小秋"); alert(Person.instanceCounter); //不能拷贝父类的prototype上的属性 p1.happy(); var init = function(){};</script></head><body onload="init();"></body></html>
原型继承：可以把父类prototype上的属性全部继承下来，而且利用内建的原型查找机制，子类的运行效率会比较高。但是，原型继承不能“继承”父类的静态属性。
对象冒充：可以继承通过this赋值的属性，配合上for...in循环的处理还可以“继承”父类的静态属性。但是，不能继承父类中通过prototype设置的属性。
对象冒充和原型继承综合运用
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; Animal.instanceCounter++; }; Animal.instanceCounter=0; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ //对象冒充,并删除不需要的属性 Person.superclass.call(this); delete this.tail; this.name = name; //拷贝父类的静态属性 for(var p in Animal){ Person[p] = Animal[p]; } }; Person.superclass = Animal; //原型继承并删除不需要的方法 var F = function(){}; F.prototype=Animal.prototype; delete F.prototype.fight; Person.prototype = new F(); Person.prototype.constructor=Person; var p1 = new Person("大漠穷秋"); alert(Person.instanceCounter); alert(p1.tail); alert(p1.name); p1.eat(); p1.fight(); var init = function(){};</script></head><body onload="init();"></body></html>
覆盖prototype上的方法
<html><head><title>11</title><META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=UTF-8"><script type="text/javascript"> Animal = function(tail){ this.tail = tail || "动物的尾巴"; Animal.instanceCounter++; }; Animal.instanceCounter=0; Animal.prototype={ happy:function(){ alert("摇动 > " + this.tail); }, eat:function(){ alert("动物吃生的"); }, run:function(){ alert("动物四条腿跑"); }, fight:function(){ alert("动物往死里打"); } }; Animal.prototype.constructor=Animal; Person = function(name){ //对象冒充,并删除不需要的属性 Person.superclass.call(this); delete this.tail; this.name = name; //拷贝父类的静态属性 for(var p in Animal){ Person[p] = Animal[p]; } }; Person.superclass = Animal; //原型继承并删除不需要的方法 var F = function(){}; F.prototype=Animal.prototype; delete F.prototype.fight; F.prototype.eat = function(){ alert("人类吃熟的"); }; /** 需要覆盖多个方法时使用Ext的apply Ext.apply(F.ptototype, { eat:function(){ alert("人类吃熟的"); } }); **/ Person.prototype = new F(); Person.prototype.constructor=Person; var p1 = new Person("大漠穷秋"); p1.eat(); var init = function(){};</script></head><body onload="init();"></body></html>
--
《ext江湖》第8章继承-代码片段
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。