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
<%@ page language= "java"  import= "java.util.*"  pageEncoding= "UTF-8" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+ "://" +request.getServerName()+ ":" +request.getServerPort()+path+ "/" ;
%>
 
<!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html>
   <head>
     <base href= "<%=basePath%>" >
     
     <title>My JSP  'test3.jsp'  starting page</title>
     
     <meta http-equiv= "pragma"  content= "no-cache" >
     <meta http-equiv= "cache-control"  content= "no-cache" >
     <meta http-equiv= "expires"  content= "0" >    
     <meta http-equiv= "keywords"  content= "keyword1,keyword2,keyword3" >
     <meta http-equiv= "description"  content= "This is my page" >
     <!--
     <link rel= "stylesheet"  type= "text/css"  href= "styles.css" >
     -->
     <script src= "js/jquery-2.1.1.min.js" ></script>
     <script type= "application/javascript" >
         //js中实现继承,采用原型链的概念
         //1.构造函数.prototype=原型对象
         //2.原型对象.constructor=构造函数(模板)
         //3.原型对象.isPropertyOf(实例对象)判断实例对象的原型是不是当前对象
         //4.构造函数,实例对象(类和实例)
         
         
         //父类构造函数 sup
         function  Sup(name){
             this .name=name;
         }
         
         Sup.prototype={
             constructor:Sup,
             sayName: function (){
                 alert( this .name);
             }
         }
         //子类构造函数  Sub
         function  Sub(age){
             this .age=age;
         }
         
         
         //如果让子类的原型对象,结果会怎么样?(实行js继承)
         //此时的原型对象包含一个指向另一个原型的指针
         //相应的;另一个原型中也包含着一个指向另一个构造函数的指针
         
         //子类的原型对象的构造器变成了父类的构造器
//      Sub.prototype=new Sup();
//      alert(Sub.prototype.constructor);        //父类构造器
 
         Sub.prototype= new  Sup( '张三' );
         var  sub1= new  Sub();
         alert(sub1.name);              //张三
         sub1.sayName();
     </script> 
     
   </head>
   
   <body>
     This is my JSP page. <br>
   </body>
</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
<%@ page language= "java"  import= "java.util.*"  pageEncoding= "UTF-8" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+ "://" +request.getServerName()+ ":" +request.getServerPort()+path+ "/" ;
%>
 
<!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html>
   <head>
     <base href= "<%=basePath%>" >
     
     <title>My JSP  'test3.jsp'  starting page</title>
     
     <meta http-equiv= "pragma"  content= "no-cache" >
     <meta http-equiv= "cache-control"  content= "no-cache" >
     <meta http-equiv= "expires"  content= "0" >    
     <meta http-equiv= "keywords"  content= "keyword1,keyword2,keyword3" >
     <meta http-equiv= "description"  content= "This is my page" >
     <!--
     <link rel= "stylesheet"  type= "text/css"  href= "styles.css" >
     -->
     <script src= "js/jquery-2.1.1.min.js" ></script>
     <script type= "application/javascript" >
         //三种继承方式
         //原型继承
         /*
         function Person(name,age){
             this.name=name;
             this.age=age;
         }
         //父类原型对象属性
         Person.prototype.id=10;
         function Boy(sex){
             this.sex=sex;
         }
         Boy.prototype=new Person('张三',21);
         var b=new Boy();
         alert(b.id);                //10
         //原型继承的特点:既继承了父类的模板,又继承了父类的原型对象
         
         
         */
         
         //类继承:只继承模板,不继承原型对象(借用构造函数的方式继承)
         
         /*
         function Person(name,age){
             this.name=name;
             this.age=age;
         }
         //父类原型对象属性
         Person.prototype.id=10;
         function Boy(name,age,sex){
             Person.call(this,name,age);          //绑定对象
             this.sex=sex;
         }
         
         var b=new Boy('张三',23,'男');
         alert(b.age);
         alert(b.name);
         alert(b.sex);
         alert(b.age);         //undefined   父类原型对象并没有继承     
         
         */
         
         
         
         //原型继承+借用构造函数继承=混合继承
         
         
         function  Person(name,age){
             this .name=name;
             this .age=age;
         }
         //父类原型对象属性
         Person.prototype.id=10;
         Person.prototype.sayName= function (){alert( this .name);}
         function  Boy(name,age,sex){
             Person.call( this ,name,age);            //1.借用构造函数继承
             this .sex=sex;
         }
         //只剩下父类的实例和弗雷德原型对象的关系了
         Boy.prototype= new  Person();                 //2.原型继承,继承父类的原型对象
         var  boy= new  Boy( '张三' ,21, '男' );
         alert(boy.id);
         boy.sayName();
         
     </script> 
     
   </head>
   
   <body>
     This is my JSP page. <br>
   </body>
</html>