日期:2014-05-16 浏览次数:20467 次
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