-
Notifications
You must be signed in to change notification settings - Fork 0
/
extend.html
113 lines (96 loc) · 2.62 KB
/
extend.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html>
<html>
<head>
<title>继承</title>
</head>
<body>
对象的深拷贝:
<script type="text/javascript">
function cloneDeep(o) {
var o1 = {};
for(var p in o){
o1[p] = o[p];
}
return o1;
}
</script>
继承就是使一个引用类型可以访问另一个引用类型的属性和方法。
1.原型链继承:让子类的原型指向父类的实例,这样子类的原型对象就能访问父类的元素和方法(虽然让子类的原型对象赋值为父类的原型对象也能实现,但是当修改子类的时候父类也会跟着改变)。
<script type="text/javascript">
function SuperType() {
this.superType = true;
}
SuperType.prototype.getSuperType = function(argument) {
// body...
return this.superType;
}
function SubType(argument) {
// body...
this.subType = false;
}
SubType.prototype = new SuperType();
SubType.prototype.getSubType = function(argument) {
// body...
return this.subType;
}
var s1 = new SubType();
/*
在这种情况下,SubType的实例就能够访问SuperType的属性和方法,这样就可以说Subtype继承自SuperType。
所有的对象都继承于Object
*/
/*
原型继承的方式,会出现属性为引用类型的污染问题,并且不能向子类传入参数
*/
</script>
2.借用构造函数:使用构造函数的方法,借用call,apply方法实现继承
<script type="text/javascript">
function SuperType(argument) {
// body...
this.arr = [1,2,3];
}
function SubType(argument) {
// body...
SuperType.call(this);
}
/*
使用借用构造函数方式就避免了父类中的引用类型的属性污染的问题,还可以在子类当中传入参数
*/
function SubType(argument) {
// body...
SuperType.call(this);
this.name = 1;
}
/*
借用构造函数得问题和之前创建对象使用的构造函数得问题相同,多次创建函数,属性就谈不上复用
*/
</script>
3.组合继承:原型继承和构造器继承相结合,这个类似于组合模式对象得创建
<script type="text/javascript">
function SuperType(argument) {
this.name = 1;
this.arr = [1,2,3];
}
SuperType.prototype.sayName = function(argument) {
// body...
return this.name;
}
function SubType(name){
SuperType.call(this, name);
this.age = 20;
}
SubType.prototype = new SuperType();
</script>
4.原型式继承
<script type="text/javascript">
function object(o) {
// body...
function F(argument) {
// body...
}
F.prototype = o;
return new F();
}
</script>
5.寄生组合式继承:完美继承
</body>
</html>