第一種 prototype 引用型原型繼承
語言支持:js原生支持的繼承方式 構造器的的prototype屬性作為類的原型 每個該類的對象都持有一個到原型的引用 當對象中的屬性不存在時 可以訪問原型的屬性
代碼示例:
語言支持:js new運算符的性質 當構造函數return值為非空對象時 new表達式返回return的對象
代碼示例:
第三種 類繼承 屬性抄寫
語言支持:for in枚舉對象所有屬性
代碼:
第四種 類繼承 對象冒充
語言支持: 1.動態添加和刪除方法 2.函數的call和apply
代碼:
用語言支持1實現的類繼承
用語言支持2實現的類繼承
第五種 原型抄寫
語言支持:通過修改類的原型對象 可以為一類對象添加屬性和方法
代碼:
第六種 元類
語言支持: js函數都是對象 且js函數可被構造
代碼:
以下通過混合構造函數與原型方式來實現JS的繼承功能。 Polygon為父類,Triangle Rectangle 為子類。
原文:http://blog.csdn.net/lenotang/archive/2008/08/27/2840315.aspx
語言支持:js原生支持的繼承方式 構造器的的prototype屬性作為類的原型 每個該類的對象都持有一個到原型的引用 當對象中的屬性不存在時 可以訪問原型的屬性
代碼示例:
<script>
function parent(){
this.x=10;
}
function child(){
}
child.prototype=new parent();
var childObj=new child();
alert(childObj.x);
</script>
第二種 復制型原型繼承function parent(){
this.x=10;
}
function child(){
}
child.prototype=new parent();
var childObj=new child();
alert(childObj.x);
</script>
語言支持:js new運算符的性質 當構造函數return值為非空對象時 new表達式返回return的對象
代碼示例:
<script>
function parent(){
this.x=10;
}
function child(){
var ret=new parent();
ret.y=20;
return ret;
}
var childObj=new child();
alert(childObj.x);</script>
function parent(){
this.x=10;
}
function child(){
var ret=new parent();
ret.y=20;
return ret;
}
var childObj=new child();
alert(childObj.x);</script>
第三種 類繼承 屬性抄寫
語言支持:for in枚舉對象所有屬性
代碼:
<script>
function parent(){
this.x=10;
}
function child(){
var parentObj=new parent();
for(var p in parentObj)this[p]=parentObj[p];
}
var childObj=new child();
alert(childObj.x);</script>
function parent(){
this.x=10;
}
function child(){
var parentObj=new parent();
for(var p in parentObj)this[p]=parentObj[p];
}
var childObj=new child();
alert(childObj.x);</script>
第四種 類繼承 對象冒充
語言支持: 1.動態添加和刪除方法 2.函數的call和apply
代碼:
用語言支持1實現的類繼承
<script>
function parent(){
this.x=10;
}
function child(){
this.parent=parent;
this.parent();
delete this.parent;
}
var childObj=new child();
alert(childObj.x);</script>
function parent(){
this.x=10;
}
function child(){
this.parent=parent;
this.parent();
delete this.parent;
}
var childObj=new child();
alert(childObj.x);</script>
用語言支持2實現的類繼承
<script>
function parent(){
this.x=10;
}
function child(){
parent.call(this);
}
var childObj=new child();
alert(childObj.x);</script>
function parent(){
this.x=10;
}
function child(){
parent.call(this);
}
var childObj=new child();
alert(childObj.x);</script>
第五種 原型抄寫
語言支持:通過修改類的原型對象 可以為一類對象添加屬性和方法
代碼:
<script>
function parent(){}
parent.prototype.me=function(){alert("parent")};
function child(){}
for(var p in parent.prototype)child.prototype[p]=parent.prototype[p];
var childObj=new child();
childObj.me();</script>
function parent(){}
parent.prototype.me=function(){alert("parent")};
function child(){}
for(var p in parent.prototype)child.prototype[p]=parent.prototype[p];
var childObj=new child();
childObj.me();</script>
第六種 元類
語言支持: js函數都是對象 且js函數可被構造
代碼:
<script>function parent(string){
var child=new Function("this.x=10;"+string);
return child;
}
var child=new parent("this.y=20;");
var childObj=new child();
alert(childObj.y);
</script>
var child=new Function("this.x=10;"+string);
return child;
}
var child=new parent("this.y=20;");
var childObj=new child();
alert(childObj.y);
</script>
以下通過混合構造函數與原型方式來實現JS的繼承功能。 Polygon為父類,Triangle Rectangle 為子類。
function Polygon (iSiders){
this.sides = iSiders;
}
Polygon.prototype.getArea = function(){
return 0;
}
function Triangle(iBase,iHeight){
Polygon.call(this,3);
this.base = iBase;
this.height = iHeight;
}
Triangle.prototype = new Polygon();
Triangle.prototype.getArea = function(){
return 0.5*this.base*this.height;
}
function Rectangle(iLength,iWidth){
Polygon.call(this,4);
this.length = iLength;
this.width = iWidth;
}
Rectangle.prototype = new Polygon();
Rectangle.prototype.getArea = function(){
return this.length*this.width;
}
var triangle = new Triangle(12,4);
var rectangle = new Rectangle(22,10);
alert(triangle.getArea);
alert(rectangle.getArea);
this.sides = iSiders;
}
Polygon.prototype.getArea = function(){
return 0;
}
function Triangle(iBase,iHeight){
Polygon.call(this,3);
this.base = iBase;
this.height = iHeight;
}
Triangle.prototype = new Polygon();
Triangle.prototype.getArea = function(){
return 0.5*this.base*this.height;
}
function Rectangle(iLength,iWidth){
Polygon.call(this,4);
this.length = iLength;
this.width = iWidth;
}
Rectangle.prototype = new Polygon();
Rectangle.prototype.getArea = function(){
return this.length*this.width;
}
var triangle = new Triangle(12,4);
var rectangle = new Rectangle(22,10);
alert(triangle.getArea);
alert(rectangle.getArea);
原文:http://blog.csdn.net/lenotang/archive/2008/08/27/2840315.aspx