日期:2014-05-16 浏览次数:20375 次
javascript其实也是一种面向对象编程语言,他同样可以实现面向对象语言的三大特性------封装,继承,多态。封装我想大家都知道了,在这里我们重点讲一下javascript的继承。
?
1、怎么用javascript编写一个类
? ? ?(1)目前,很多面向对象语言都定义了class来定义一个类,但是javascript并没有,那么我们应该怎么去用它来编写一个类呢?
其实我们简单的是使用function就可以啦。下面给一个例子,我想大家看后就会明白的啦。在实例中学习嘛,哈哈。
?
function Person(){ //定义一个Person类 this.name; this.age; this.showInfo = function(){ //封装一个方法,让Person类输出自己的相关信息 document.write("大家好,我是 " + this.name + " ,今年 " + this.age + " 岁啦!"); } } var person = new Person(); //创建Person类的实例 person.name = "tom"; //为Person类的属性赋值 person.age = 11; person.showInfo(); //调用Person类的方法
?在浏览器中的结果显示为:
?
大家好,我是 tom ,今年 11 岁啦!
但是如果我们想要给函数定义一个构造函数怎么办,看这个例子你就懂了:
?
function Person(myName, myAge){ //定义一个Person类 this.name = myName; this.age = myAge; this.showInfo = function(){ //封装一个方法,让Person类输出自己的相关信息 document.write("大家好,我是 " + this.name + " ,今年 " + this.age + " 岁啦!"); } } var person = new Person("tom", 11); //创建Person类的实例 person.showInfo(); //调用Person类的方法
?
?结果显示跟上面一样。
?
2、怎么实现继承特性
那么我们用javascript编写好一个类后,我们怎么去实现继承呢?这个就涉及到我们前面所学的prototype啦。
//定义一个父类Person function Person(){ this.name ; this.age ; this.showInfo = function(){ //封装一个方法,让Person类输出自己的相关信息 document.write("大家好,我是 " + this.name + " ,今年 " + this.age + " 岁啦!"); } } //定义一个子类Child function Child(){} Child.prototype = new Person(); //继承Person var child = new Child(); child.name = "Cat"; child.age = 11; child.showInfo();?
?
在浏览器中显示的结果为:
?
大家好,我是 Cat ,今年 11 岁啦!
?
?
在该实例中,重点在于prototype,我们继承就是通过这个来实现的啦,这个将涉及到原型,深入就到后面再讲,在这篇文章中,主要是为了让我们知道,继承是通过这个方式来实现的,当然还有另外一中形式。下面就来说一下吧。
?
3、使用$super实现访问父类
?
很多面向对象编程语言中,都会定义关键字super来访问父类,但是javascript里面没有,所以我们必须要先自己定义来实现这个功能,鉴于javascript所有的类都是有Object派生而来的,我们就为Object新定义一个$super方法,该方法可以用于其他所有的类。
?
?
//自定义$super()方法,用于访问父类 Object.prototype.$super = function(){ var result; try{ result = eval(this.constructor).prototype.constructor; result.apply(this, arguments); }catch(err){ throw new Error("only can be used in constructor"); } return result; }
?
?
然后我们就可以使用这个方法啦:
?
function Child(){ this.$super(myName, myAge); //调用父类的构造函数 }
?
?下面给出一个完整示例,让大家对它的用法更加清晰吧。
示例1(仍然使用prototype来实现继承):
?
//自定义$super()方法,用于访问父类 Object.prototype.$super = function(){ var result; try{ result = eval(this.constructor).prototype.constructor; result.apply(this, arguments); }catch(err){ throw new Error("only can be used in constructor"); } return result; } //定义一个父类Person function Person(myName, myAge){ this.name = myName; this.age = myAge; this.showInfo = function(){ //封装一个方法,让Person类输出自己的相关信息 document.write("大家好,我是 " + this.name + " ,今年 " + this.age + " 岁啦!"); } } //定义一个子类Child function Child(myName, myAge){ this.$super(myName, myAge);//调用父类的构造函数 } Child.prototype = new Person(); //继承Person var child = new Child("Tom", 11); child.showInfo();
?
示例2(仍然使用$super来实现继承):
?
Object.prototype.$super = function(){ var result; try{ result = eval(this.constructor).prototype.constructor; result.apply(this, arguments); }catch(err){ throw new Error("only can be used in constructor"); } return re