javascript 继承
1.原型继承
1
Function.prototype.method=function(name,func){
2
this.prototype[name]=func;
3
}
4![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
5
Function.method("inherit",function(parent){
this.method("old",function (name){
8
return parent.prototype[name].call(this,"");//利用闭包特性,获取parent
9
});
10
});
11
Function.method("elect",function(parent){
12
for(var i=1;i<arguments.length;i++){
13
//var methodName=arguments[i];
14
this.prototype[arguments[i]]=parent.prototype[arguments[i]];
15
}
16
});
17
function Person2(name){
18
this.name=name;
19
this.id=2;
20
}
21
Person2.method("getName2",function(){//一次次使用感觉烦
22
return this.name;
23
});
24
function User2(name,password){
25
this.name=name;
26
this.password=password;
27
}
28
//从Person对象继承所有"属性"和"方法"
29
User2.inherit(Person2);//全部继承
30![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
31
//给User对象添加一个新的方法
32
User2.method("getPassword2",function(){//一次次使用感觉烦
33
return "您的密码为 "+this.password;
34
})
35![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
36
//覆盖Person2对象创建的getName2方法,但通过old方法来调用原有方法
37
User2.method("getName2",function(){
38
//this.constructor 有个怪异的现象,这里的构造函数指向的是Person2,我晕
39
return "My name is: "+this.old("getName2");
40
})
41![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
42
var user2=new User2("peter",22);
43
alert(user2.getName2());//outputs My name is peter
44
alert(user2.getPassword2());//outputs 您的密码为 22
1
function Person1(name){
2
this.name=name;
3
this.id=1;
4
}
5
Person1.prototype.getName=function(){
6
return "hello "+this.name;
7
};
8
function User1(name,password){
9
this.name=name;
10
this.password=password;
11
}
12
User1.prototype=new Person1();
13
User1.prototype.getPassword=function(){
14
return "你的密码为 "+this.password;
15
};
16
var user1=new User1("peter",22);
17
alert(user1.name);//outputs peter
18
alert(user1.getName());//outputs hello peter
19
alert(user1.password);//outputs 22
20
alert(user1.getPassword());//你的密码为 22
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
2
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
3
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
4
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
5
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
6
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
7
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
8
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
9
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
10
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
11
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
12
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
13
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
14
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
15
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
16
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
17
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
18
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
19
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
20
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
原型继承使用prototype原型对象,
注意点:
1. User1.prototype=new Person1();这样的形式时,如果再要为对象创建方法或属性,不能以这样的形式
User1.prototype={
//some code
};
原因是改变了prototype对象的指向
2.类式继承
这样的继承是看到JQuery之父的精通js,从网上下的pdf,里面代码多数都是有问题,不知道是不是出版商的应付了事 ,
代码本身也比较多,也有很多错误之处,修改如下:
1
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
2
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
3
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
4
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
5
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
6 this.prototype=new parent();//继承父对象的方法
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
8
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
9
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
10
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
11
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
12
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
13
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
14
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
15
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
16
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
17
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
18
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
19
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
20
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
21
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
22
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
23
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
24
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
25
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
26
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
27
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
28
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
29
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
30
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
31
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
32
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
33
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
34
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
35
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
36
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
37
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
38
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
39
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
40
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
41
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
42
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
43
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
44
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
这里比上面高级一点,可以在重定义继承来的方法时,在内部使用this.old来调用重定义前的方法,如果不需要全部继承的话
可以这样使用,有选择的继承
1
User2.elect(Person2,"getName2","或其他要继承的方法")
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
3. 还有个base库继承,没看过,但据说比上面都好用