javascript 用原型继承来实现对象系统_Javascript教程-查字典教程网
javascript 用原型继承来实现对象系统
javascript 用原型继承来实现对象系统
发布时间:2016-12-30 来源:查字典编辑
摘要:javascript中,对象没有原型,而构造器有原型原型的含义:如果构造器有一个原型对象A,则由该构造器创建的实例都必然复制自A复制代码代码...

javascript中,对象没有原型,而构造器有原型

原型的含义:如果构造器有一个原型对象 A,则由该构造器创建的实例都必然复制自A

复制代码 代码如下:

/*申明2个构造器*/

var flower=function(){

this.name="nokia";

}

var flower2=function(){

this.age=22;

}

/*原型链*/

flower2.prototype=new flower();

/*根据刚才原型的定义,实例obj必然复制自new flower();*/

obj=new flowe2();

/*从父类继承的属性*/

alert(obj.name); //==>"nokia"

alert(obj.age); //==>22

一个构造器产生的实例,其constructor属性默认总是指向该构造器

alert(obj.constructor);//==>flower

构造器原型的constructor属性 指向构造器本身

alert(flower.prototype.constructor==flower);//==>true

constructor会与原型继承发生的冲突

复制代码 代码如下:

function flower(){}

function flower2(){}

flower2.prototype=new flower();

var obj1=new flower();

var obj2=new flower2();

/*问题出现了,2个实例的constructor属性都指向flower*/

alert(obj1.constructor==obj2.constructor);

/*obj1和obj2是不同的构造器产生的实例,缺指向相同的构造器,显然出了问题*/

解决的方法

复制代码 代码如下:

flower2.prototype=new flower();

/*重置原型后,修改原型的constructor属性*/

flower2.prototype.constructor=flower2

或每次构造实例时都重写constructor属性

function flower2(){

this.constructor=arguments.callee;

}

flower2.prototype=new flower();

此外原型继承没有提供调用父类的方法

然而我们基于原型继承,通过静态变量记录父类来弥补这一缺陷

复制代码 代码如下:

var Class={

create:function()

{

var _class=function()

{

this.init.apply(this,arguments);

}

_class.prototype.init=Function.prototype.init;

try{

return _class;

}finally{

_class=null;

}

}

};

//默认构造函数

Function.prototype.init=function(){}

//方法扩展

Function.prototype.extend=function(list)

{

for(var i in list)this.prototype[i]=list[i];

return this;

}

//多级继承

Function.prototype.inherits=function(parent)

{

//继承的深度级别

var _depth=0;

//方法属性移植

this.extend(new parent());

//初始化构造函数 类的继承通常不继承构造函数

this.prototype.init=Function.prototype.init;

//类的静态父类

this.parent=parent;

//执行父类函数

this.prototype.parent=function(name)

{

//若没有参数则执行构造函数

if(!name)name='init';

//即将执行的父类

var _parent=parent;

//若当前已经在父类中执行则继续向上寻找超类

if(_depth)

{

for(var i=0;i<_depth;i++)

{

_parent=_parent.parent;

}

}

//设置好级别

_depth++;

try{

//执行函数并返回值

return _parent.prototype[name].apply(this,Array.prototype.slice.apply(arguments,[1]));

}catch(e){

throw(e);

}finally{

//恢复级别

_depth--;

}

}

return this;

}

例子:

复制代码 代码如下:

//创建名为class1的构造器

var class1=Class.create().extend({

b:function()

{

alert('clas');

alert(this.c);

},

c:100

});

//创建"对象"(构造器)的实例

var s=new class1();

s.b();// ==>"clas",100

继承父类,并调用父类的方法:

复制代码 代码如下:

var test=Class.create().inherits(class1).extend({

b:function()

{

alert('test');

this.parent('b')

},

c:110

});

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类