`
linhui_dragon
  • 浏览: 148989 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

js继承的几种实现方法

 
阅读更多
js继承的几种实现方法
 


[size=x-small]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title> New Document </title>

  	<script type="text/javascript">

/*	 <!-- --------------继承的第一种方式：对象冒充------ -->
 
		 function Parent(name){
			 this.name = name;
			 this.showInfo = function(){
				 document.write(name); 
				 document.write("</br>");
			 } 
		 }
		 
		function Children(name, pwd){
			//下面三行代码实现了子对象和父对象指向同一个引用
			//关键的代码 this.method = Parent;this.method(name);delete this.method;
		 
			this.pwd = pwd;this.showMsg = function(){
			document.write(this.pwd);
			document.write("</br>");
			}
		}
		 
		var parent = new Parent("John");
		var child = new Children("Bob", 123);
		 
		parent.showInfo();
	//	child.showInfo();
		child.showMsg();
		 
		document.write("");
		document.write("</br>");
		 
		//call方法，是function里的一个方法。
		 
		//------------------call方法简单示例----------------
		 
		function test(str) {
			document.write(this.name + "," + str+"</br>");
		}
		 
		var person = new Object();
		person.name = "anllin";
		 
		//相当于调用了test方法test.call(person, "welcome"); 
		//将person赋给了test里的this。
		 
		document.write("");
		document.write("</br>");

*/


/*	//-------------继承的第二种方式，call方法---------------------
	 
	function Father(name){
		this.name = name;
		this.showName = function(){
			document.write(this.name + "<br />");
		 }
	}
	
	function Sub(name, pwd){
	//关键的代码 :this是方法执行时上下文相关对象,name是传给Father方法的参数
		Father.call(this, name);

	 	this.name = name;
		this.pwd = pwd;	
		this.showPwd = function(){
			document.write(this.pwd+"<br />");
		}
	}
	 
	var father = new Father("Father's name");
	var sub = new Sub("Sub's name", 123456);
	father.showName();
	sub.showName();
	sub.showPwd();
	 
	document.write("");
	document.write("<br />");
*/


/*	//--------------继承的第三种方式，apply方法------------------
	 
	function Mother(name){
		this.name = name;
		this.showName = function(){
			document.write(this.name + "</br>");
		}
	}
	 
	function Daugther(name, pwd){
		//关键的代码 : 第一个参数是方法执行时上下文相关对象，第二个参数是一个参数数组。
		Mother.apply(this, new Array(name));
	 
		this.pwd = pwd;
		this.showPwd = function(){
			document.write(this.pwd + "<br>");
		}
	}
	 
	var mother = new Mother("Mother’s name");
	var daugther = new Daugther("Daugther's name", 654321);
	mother.showName();
	daugther.showName();
	daugther.showPwd();
	 
	document.write("");
	document.write("</br>");
*/


/*	//----------继承的第四种方式，prototype chain方式----------
	 
	//缺点：无法给构造函数传参数。
	 
	function Human(){ 

	}
	 
	Human.prototype.name = "human'name";
	Human.prototype.showName = function(){
		document.write(this.name+"<br>");
	}
	 
	function Student() { 

	}
	 
	//关键的代码
	Student.prototype = new Human();
	 
	Student.prototype.password = 456789;
	Student.prototype.showPwd = function(){
		document.write(this.password + "<br>");
	}
	 
	var human = new Human();
	var student = new Student();
	student.name = "student'name ";
	human.showName();
	student.showName();
	student.showPwd();
	 
	document.write("");
	document.write("</br>");
*/


/*	//-------------继承的第五种方式，混合方式---------------

	function FatherClass(name){
		this.name = name;
	}
	 
	FatherClass.prototype.showName = function(){
		document.write(this.name + "<br>");
	}
	 
	function SubClass(name, pwd){	 
		//关键的代码	 
		FatherClass.call(this,name);
		this.pwd = pwd;
	}
	 
	//关键的代码	 
	SubClass.prototype = new FatherClass;
	 
	SubClass.prototype.showPwd = function(){
		document.write(this.pwd + "<br>");
	}
	 
	var f = new FatherClass("FatherClass");
	var s = new SubClass("SubClass", 45678);
	f.showName();
	s.showName();
	s.showPwd();
*/

</script>

 </head>

 <body>
  
 </body>
</html>
[/size]
分享到：
| input失去焦点和获得焦点jquery焦点事件
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics