<%@ 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>
三种继承方式:
<%@ 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>