TH889

BlogJava :: 首頁 :: 新隨筆 :: 聯系 :: 聚合

:: 管理 ::

2 隨筆 :: 0 文章 :: 0 評論 :: 0 Trackbacks

<

2012年8月

>

日

一

二

三

四

五

六

29

30

31

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

1

2

3

4

5

6

7

8

常用鏈接

留言簿

隨筆檔案

2012年8月 (2)

搜索

閱讀排行榜

評論排行榜

js繼承有5種實現方式：

1

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2

<html>
3

<head>
4

<title> New Document </title>
5

js繼承有5種實現方式：
11

1、繼承第一種方式：對象冒充
12

function Parent(username){
13

this.username = username;
14

this.hello = function(){
15

alert(this.username);
16

}
17

}
18

function Child(username,password){
19

//通過以下3行實現將Parent的屬性和方法追加到Child中，從而實現繼承
20

//第一步：this.method是作為一個臨時的屬性，并且指向Parent所指向的對象，
21

//第二步：執行this.method方法，即執行Parent所指向的對象函數
22

//第三步：銷毀this.method屬性，即此時Child就已經擁有了Parent的所有屬性和方法
23

this.method = Parent;
24

this.method(username);//最關鍵的一行
25

delete this.method;
26

27

this.password = password;
28

this.world = function(){
29

alert(this.password);
30

}
31

}
32

var parent = new Parent("zhangsan");
33

var child = new Child("lisi","123456");
34

parent.hello();
35

child.hello();
36

child.world();
37

38

2、繼承第二種方式：call()方法方式
39

call方法是Function類中的方法
40

call方法的第一個參數的值賦值給類(即方法)中出現的this
41

call方法的第二個參數開始依次賦值給類(即方法)所接受的參數
42

43

function test(str){
44

alert(this.name + " " + str);
45

}
46

var object = new Object();
47

object.name = "zhangsan";
48

test.call(object,"langsin");//此時，第一個參數值object傳遞給了test類(即方法)中出現的this，而第二個參數"langsin"則賦值給了test類(即方法)的str
49

50

function Parent(username){
51

this.username = username;
52

this.hello = function(){
53

alert(this.username);
54

}
55

}
56

function Child(username,password){
57

Parent.call(this,username);
58

59

this.password = password;
60

this.world = function(){
61

alert(this.password);
62

}
63

}
64

var parent = new Parent("zhangsan");
65

var child = new Child("lisi","123456");
66

parent.hello();
67

child.hello();
68

child.world();
69

70

3、繼承的第三種方式：apply()方法方式
71

apply方法接受2個參數，
72

A、第一個參數與call方法的第一個參數一樣，即賦值給類(即方法)中出現的this
73

B、第二個參數為數組類型，這個數組中的每個元素依次賦值給類(即方法)所接受的參數
74

75

function Parent(username){
76

this.username = username;
77

this.hello = function(){
78

alert(this.username);
79

}
80

}
81

function Child(username,password){
82

Parent.apply(this,new Array(username));
83

84

this.password = password;
85

this.world = function(){
86

alert(this.password);
87

}
88

}
89

var parent = new Parent("zhangsan");
90

var child = new Child("lisi","123456");
91

parent.hello();
92

child.hello();
93

child.world();
94

95

4、繼承的第四種方式：原型鏈方式，即子類通過prototype將所有在父類中通過prototype追加的屬性和方法都追加到Child，從而實現了繼承
96

function Person(){
97

}
98

Person.prototype.hello = "hello";
99

Person.prototype.sayHello = function(){
100

alert(this.hello);
101

}
102

103

function Child(){
104

}
105

Child.prototype = new Person();//這行的作用是：將Parent中將所有通過prototype追加的屬性和方法都追加到Child，從而實現了繼承
106

Child.prototype.world = "world";
107

Child.prototype.sayWorld = function(){
108

alert(this.world);
109

}
110

111

var c = new Child();
112

c.sayHello();
113

c.sayWorld();
114

115

5、繼承的第五種方式：混合方式
116

混合了call方式、原型鏈方式
117

118

function Parent(hello){
119

this.hello = hello;
120

}
121

Parent.prototype.sayHello = function(){
122

alert(this.hello);
123

}
124

125

function Child(hello,world){
126

Parent.call(this,hello);//將父類的屬性繼承過來
127

this.world = world;//新增一些屬性
128

}
129

130

Child.prototype = new Parent();//將父類的方法繼承過來
131

132

Child.prototype.sayWorld = function(){//新增一些方法
133

alert(this.world);
134

}
135

136

var c = new Child("zhangsan","lisi");
137

c.sayHello();
138

c.sayWorld();
139

</script>
140

</head>
141

<body>
142

143

</body>
144

</html>
145

posted on 2012-08-13 23:09 TH 閱讀(148) 評論(0) 編輯收藏

新用戶注冊刷新評論列表


只有注冊用戶登錄后才能發表評論。




網站導航: 博客園 IT新聞 Chat2DB C++博客博問

TH889

常用鏈接

留言簿

隨筆檔案

搜索

最新評論

閱讀排行榜

評論排行榜