谈一谈javascript中继承的多种方式
JS是没有继承的，不过可以曲线救国，利用构造函数、原型等方法实现继承的功能。
varo=newObject();
其实用构造函数实例化一个对象，就是继承，这里可以使用Object中的所有属性与方法。那么为什么能访问Object对象的方法，其实访问的是其原型对象的方法，所有的方法都是放在原型中而不是类中。
console.log(o.__proto__===Object.prototype)//true继承的本质 console.log(o.__proto__===Object); console.log(Object.__proto__===Function.prototype); console.log(Function.prototype.__proto__===Object.prototype); console.log(Number.__proto__===Function.prototype);
object是万物祖先，Everythingisobject嘛。
1、内置对象都继承自object
varmyNumber=newNumber(10);//实例化一个数字对象
字符串对象，其实是String对象的一个实例化
vars=‘str';
除了可以访问自身属性方法，还能访问父类属性方法
console.log(s.toUpperCase()); console.log(s.toString());
2、自定义对象的继承
//父类
varPerson=function(){
this.name='AV老师';
this.test='测试中的毕福剑';
}
Person.prototype={
say:function(){
console.log('呀买碟');
}
}
//构造函数
varCanglaoshi=function(name,age,cup){
this.name=name;
this.age=age;
this.cup=cup;
}
//继承person,则拥有person原型中的方法
Canglaoshi.prototype=newPerson();
Canglaoshi.prototype.ppp=function(){
console.log('啪啪啪');
}
//苍老师拥有了person中的方法
varxiaocang=newCanglaoshi('空空',18,'E');
xiaocang.say();
console.log(xiaocang.name);
console.log(xiaocang.age);
console.log(xiaocang.cup);
console.log(xiaocang.test);
3、自定义对象继承的原型链演示
(function(){
//父类
functionSuperParent(){
this.name='mike';
}
//子类继承父亲-二次继承：
functionParent(){
this.age=12;
}
Parent.prototype=newSuperParent();//通过原型，形成链条
varparent=newParent();
console.log("测试父亲可以访问爷爷属性："+parent.name);
console.log("测试父亲可以访问自己的属性："+parent.age);
//继续原型链继承-三次继承
functionChild(){//brother构造
this.weight=60;
}
Child.prototype=newParent();//继续原型链继承
//原型链测试2
//儿子集成爷爷
varchild=newChild();
console.log("测试儿子可以访问爷爷的属性："+child.name);//继承了Parent和Child,弹出mike
console.log("测试儿子可以访问父亲的属性："+child.age);//弹出12
console.log("测试儿子可以访问自己独特的属性："+child.weight);//弹出12
//原型链测试
//爷爷可以访问Object中的方法
vartest=newSuperParent();
console.log(test.name);
console.log(test.toString());
//访问链：SuperParent构造对象--》SuperParent原型对象--》Object对象--》Obect原型对象（找到toString方法）--》null
console.log(child.name);
//原型链：首先访问Child构造函数，发现没有name属性--》寻找__proto__，判断起指针是否为空--》指向Child原型函数，寻找有没有name属性--》
//---》没有找到，则判断其__proto__属性是否为null，如果不为null，继续搜索--》找到parent对象，检查是否有name属性，没有。。。。
})()
4、构造函数继承
(function(){
functionPeople(){
this.race='人类';
}
People.prototype={
eat:function(){
alert('吃吃吃');
}
}
/*人妖对象*/
functionShemale(name,skin){
People.apply(this,arguments);//用call也是一样的，注意第二个参数
this.name=name;
this.skin=skin;
}
//实例化
varzhangsan=newShemale('张三','黄皮肤')
console.log(zhangsan.name);//张三
console.log(zhangsan.skin);//黄皮肤
console.log(zhangsan.race);//人类
})()
5、组合继承
(function(){
functionPerson(name,age){
this.name=name;
this.age=age;
}
Person.prototype.say=function(){}
functionMan(name,age,no){
/*会自动调用Person的方法，同时将nameage传递过去*/
Person.call(this,name,age);
//自己的属性
this.no=no;
}
Man.prototype=newPerson();
varman=newMan("张三",11,"0001");
console.log(man.name);
console.log(man.age);
console.log(man.no);
})()
6、拷贝继承
<script>
+(function(){
varChinese={
nation:'中国'
};
varDoctor={
career:'医生'
};
//请问怎样才能让"医生"去继承"中国人"，也就是说，我怎样才能生成一个"中国医生"的对象？
//这里要注意，这两个对象都是普通对象，不是构造函数，无法使用构造函数方法实现"继承"。
functionextend(p){
varc={};
for(variinp){
c[i]=p[i];
}
c.uber=p;
returnc;
}
varDoctor=extend(Chinese);
Doctor.career='医生';
alert(Doctor.nation);//中国
})()
</script>
7、寄生组合继承
<script>
+(function(){
/*继承的固定函数*/
functioninheritPrototype(subType,superType){
varprototype=Object(superType.prototype);
prototype.constructor=subType;
subType.prototype=prototype;
}
functionPerson(name){
this.name=name;
}
Person.prototype.say=function(){}
functionStudent(name,age){
Person.call(this,name);
this.age=age;
}
inheritPrototype(Student,Person);
varxiaozhang=newStudent('小张',20);
console.log(xiaozhang.name)
})()
</script>
8、使用第三方框架实现继承
<scriptsrc='simple.js'></script>
<!--使用的第三方框架simple.js-->
<script>
+(function(){<script>
varPerson=Class.extend({
init:function(age,name){
this.age=age;
this.name=name;
},
ppp:function(){
alert("你懂的");
}
});
varMan=Person.extend({
init:function(age,name,height){
this._super(age,name);
this.height=height;
},
ppp:function(){
/*调用父类的同名方法*/
this._super();
/*同时又可以调用自己的方法*/
alert("好害羞-，-");
}
});
varxiaozhang=newMan(21,'小张','121');
xiaozhang.ppp();
})()
希望对大家学习javascript程序设计有所帮助。