Skip to content

Commit c26cf85

Browse files
committed
Update
1 parent fb7a1f8 commit c26cf85

File tree

3 files changed

+179
-86
lines changed

3 files changed

+179
-86
lines changed

Example/new.html

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<title>new</title>
7+
</head>
8+
9+
<body>
10+
<script type="text/javascript">
11+
function MyFi(name) {
12+
this.name = name
13+
}
14+
var list = new MyFi('123');
15+
console.log('list', list);
16+
//console.log(list('lucy'));
17+
console.log(new MyFi('lily'));
18+
19+
var p = {
20+
name: 'zhangsan'
21+
};
22+
var o4 = Object.create(p);
23+
console.log(o4);
24+
25+
function Parent1() {
26+
this.name = 'Parent1';
27+
}
28+
Parent1.prototype.say = function() {}
29+
30+
function Child1() {
31+
Parent1.call(this); //apply
32+
this.type = 'C';
33+
}
34+
35+
console.log(new Child1, new Parent1);
36+
</script>
37+
</body>
38+
39+
</html>
40+
</body>
41+
42+
</html>

Example/opp.html

Lines changed: 94 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -1,98 +1,107 @@
11
<!DOCTYPE html>
22
<html>
3+
34
<head>
45
<meta charset="utf-8">
56
<title>面向对象</title>
67
</head>
8+
79
<body>
810
<script type="text/javascript">
9-
//类的声明
10-
function Animal() {
11-
this.name = 'name';
12-
}
13-
//ES6中class的声明
14-
class Animal2 {
15-
constructor() {//构造函数
11+
//类的声明
12+
function Animal() {
1613
this.name = 'name';
1714
}
18-
}
19-
//通过类实例化生成对象
20-
console.log(new Animal(),new Animal2());
21-
//借助构造函数实现继承
22-
function Parent1() {
23-
this.name = 'parent1';
24-
}
25-
//Parent1
26-
function Child1() {
27-
Parent1.call(this);//apply
28-
this.type = 'child1';
29-
}
30-
31-
console.log(new Child1);
32-
//借助原型链继承方式
33-
function Parent2() {
34-
this.name = 'parent2';
35-
this.play = [1,2,3];
36-
}
37-
function Child2() {
38-
this.type = 'child2'
39-
}
40-
41-
Child2.prototype = new Parent2();//理解为prototype属性指向Parent2
42-
43-
console.log(new Child2());
44-
45-
var s1 = new Child2();
46-
var s2 = new Child2();
47-
console.log(s1.play,s2.play);
48-
s1.play.push(4);
49-
50-
//组合方式
51-
function Parent3() {
52-
this.name = 'Parent3';
53-
this.play = [1,2,3];
54-
}
55-
function Child3() {
56-
Parent3.call(this);
57-
this.type = 'Child3';
58-
}
59-
60-
//子类化原型链 执行了两次实例化
61-
Child3.prototype = new Parent3();
62-
var s3 = new Child3();
63-
var s4 = new Child3();
64-
s3.play.push(5);
65-
console.log(s3.play,s4.play);
66-
//面向对象通用继承
67-
68-
//组合继承的优化1
69-
function Parent4() {
70-
this.name = 'Parent4';
71-
this.play = [1,2,3];
72-
}
73-
function Child4() {
74-
Parent4.call(this);
75-
this.type = 'Child4';
76-
}
77-
Child4.prototype = Parent4.prototype;
78-
var s5 = new Child4();
79-
var s6 = new Child4();
80-
console.log(s5,s6);
81-
82-
console.log(s5 instanceof Child4, s5 instanceof Parent4);//true
83-
console.log(s5.__proto__===Child4.prototype , s5.__proto__===Parent4.prototype);//true
84-
console.log(s5.constructor);
85-
86-
//组合继承的优化2
87-
function Parent5() {
88-
this.name = 'Parent5';
89-
this.play = [1,2,3];
90-
}
91-
function Child5() {
92-
Parent4.call(this);
93-
this.type = 'Child5';
94-
}
95-
Child5.prototype = Object.create(Parent5.prototype);
15+
//ES6中class的声明
16+
class Animal2 {
17+
constructor() { //构造函数
18+
this.name = 'name';
19+
}
20+
}
21+
//通过类实例化生成对象
22+
console.log(new Animal(), new Animal2());
23+
//借助构造函数实现继承
24+
function Parent1() {
25+
this.name = 'parent1';
26+
}
27+
//Parent1
28+
function Child1() {
29+
Parent1.call(this); //apply
30+
this.type = 'child1';
31+
}
32+
33+
console.log(new Child1);
34+
//借助原型链继承方式
35+
function Parent2() {
36+
this.name = 'parent2';
37+
this.play = [1, 2, 3];
38+
}
39+
40+
function Child2() {
41+
this.type = 'child2'
42+
}
43+
44+
Child2.prototype = new Parent2(); //理解为prototype属性指向Parent2
45+
46+
console.log(new Child2());
47+
48+
var s1 = new Child2();
49+
var s2 = new Child2();
50+
console.log(s1.play, s2.play);
51+
s1.play.push(4);
52+
53+
//组合方式
54+
function Parent3() {
55+
this.name = 'Parent3';
56+
this.play = [1, 2, 3];
57+
}
58+
59+
function Child3() {
60+
Parent3.call(this);
61+
this.type = 'Child3';
62+
}
63+
64+
//子类化原型链 执行了两次实例化
65+
Child3.prototype = new Parent3();
66+
var s3 = new Child3();
67+
var s4 = new Child3();
68+
s3.play.push(5);
69+
console.log(s3.play, s4.play);
70+
//面向对象通用继承
71+
72+
//组合继承的优化1
73+
function Parent4() {
74+
this.name = 'Parent4';
75+
this.play = [1, 2, 3];
76+
}
77+
78+
function Child4() {
79+
Parent4.call(this);
80+
this.type = 'Child4';
81+
}
82+
Child4.prototype = Parent4.prototype;
83+
var s5 = new Child4();
84+
var s6 = new Child4();
85+
console.log(s5, s6);
86+
87+
console.log(s5 instanceof Child4, s5 instanceof Parent4); //true
88+
console.log(s5.__proto__ === Child4.prototype, s5.__proto__ === Parent4.prototype); //true
89+
console.log(s5.constructor);
90+
91+
//组合继承的优化2
92+
function Parent5() {
93+
this.name = 'Parent5';
94+
this.play = [1, 2, 3];
95+
}
96+
97+
function Child5() {
98+
Parent5.call(this);
99+
this.type = 'Child5';
100+
}
101+
Child5.prototype = Object.create(Parent5.prototype);
102+
Child5.constructor = Child5;
103+
console.log(new Child5, new Parent5);
96104
</script>
97105
</body>
106+
98107
</html>

0 commit comments

Comments
 (0)