`
linhui_dragon
  • 浏览: 155987 次
  • 性别: 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焦点事件
评论
发表评论

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

相关推荐

    JavaScript实现继承的几种方式

    本篇文章将深入探讨JavaScript中实现继承的几种常见方式。 1. 原型链继承 JavaScript的原型（prototype）机制是实现继承的基础。每个函数都有一个prototype属性，这个属性指向一个对象，这个对象的属性和方法可以被...

    【JavaScript的9种继承实现方式归纳】js实现继承的几种方式.pdf

    JavaScript 的 9 种继承实现方式归纳 JavaScript 中的继承方式是基于原型的，与基于类的编程语言，如 C++ 和 Java，截然不同。JavaScript 的灵活性使得其实现继承的方式非常多样化。本文将介绍 JavaScript 中的 9 ...

    javascript的几种继承方法介绍.doc

    javascript的几种继承方法介绍.doc

    javascript的几种继承方法介绍_.docx

    本文将详细介绍JavaScript中的三种主要继承方法：原型链继承、构造函数继承以及组合继承。 1. **原型链继承**： - 概念：每个JavaScript函数都有一个`prototype`属性，这个属性是一个对象，当创建一个新对象时，这...

    JS继承的实现方式

    下面将详细介绍几种常见的继承实现方式，并探讨它们的特点与应用场景。 #### 一、原型链继承 **核心思想**: 将父类的实例设置为子类的原型。 **实现方式**: ```javascript function Animal(name) { this.name = ...

    【JavaScript源代码】JavaScript继承的三种方法实例.docx

    ### JavaScript继承的三种方法实例详解 #### 一、概述 在JavaScript中，虽然原生语言层面没有提供传统意义上的“类”这一概念，但它通过构造函数和原型链等机制实现了类的功能，尤其是继承这一核心概念。继承是...

    【JavaScript源代码】JavaScript中的几种继承方法示例.docx

    ### JavaScript中的几种继承方法示例 #### 一、原型链继承 **原理**: 在JavaScript中，原型链继承是一种实现继承的方式，它通过让子类的原型对象指向父类的一个实例来实现属性和方法的共享。 - **核心概念**: 每个...

    js继承.doc

    实现继承主要有以下几种方式： 1. **原型链继承**：这是最基础的继承方式，通过修改子类的`prototype`为父类的实例，实现共享父类的属性和方法。例如： ```javascript function subObj() {} subObj.prototype = ...

    JS继承的几种方式的附录源码

    JS继承的几种方式的附录源码

    javascript继承之工具函数二

    本篇将深入探讨一种实现继承的工具函数方法，主要聚焦于`source.js`文件中可能包含的内容。通过阅读这篇博文（链接已提供），我们可以学习如何构建自己的继承工具函数，并理解其工作原理。 在JavaScript中，常见的...

    JS继承.txtJS继承.txt

    以上就是JavaScript中几种常见的继承方式，每种方式都有其适用场景和局限性。在实际开发中，根据具体需求选择合适的继承方式是非常重要的。例如，在需要传递初始化参数时，可以考虑使用构造函数继承或组合继承；而在...

    javascript 继承实现方法

    以下就是几种在JavaScript中实现继承的方式。 对象冒充（Pseudoclassical Inheritance）: 对象冒充是利用构造函数和函数的call方法来实现的。构造函数使用this关键字定义属性和方法，而call方法则可以调用指定对象...

    JS封装和继承-入门级

    主要有以下几种继承方式： 1. **原型链继承**：JavaScript的对象都有一个proto属性，指向创建它的函数的原型对象。通过修改原型对象，可以实现属性和方法的继承。这是JavaScript中最基础的继承方式。 2. **构造...

    浅谈Javascript实现继承的方法

    它使用原型链实现方法的继承，同时又利用构造函数来继承父对象的属性。组合继承避免了子对象共享父对象引用类型属性的问题，同时也继承了父对象原型链上的方法。其主要缺点是调用了两次父构造函数，一次是在创建子...

    javascript的几种继承方法介绍

    在JavaScript中，主要有以下几种继承方法： 1. **原型链继承** 原型链继承是JavaScript中最基础的继承方式，利用原型对象（`__proto__`或`prototype`）之间的链接实现。每个构造函数都有一个`prototype`属性，这个...

    JS实现继承的几种常用方式示例

    JavaScript中的继承是面向对象编程的重要概念，它允许创建基于现有对象的新对象，这些新对象能够继承已有对象的属性和方法。在JavaScript中，有多种实现继承的方式，主要包括原型链继承、构造继承、组合继承以及寄生...

    js之几种继承的方式.js

    配合我的博文 js 之几种继承的方式一起学习，欢迎大家交流指正

    JavaScript继承机制探讨及其应用.pdf

    JavaScript继承机制探讨及其应用 JavaScript是一门弱类型语言，具有函数式编程和面向对象编程的特点。随着近几年JavaScript生态圈的发展和成熟，项目的编码量和复杂度也在呈几何级数增长。JavaScript面向对象编程中...

    Javascript中的几种继承方式对比分析

    在JavaScript中，有多种实现继承的方式，每种都有其优缺点，适用于不同的场景。 首先，我们来看**原型链继承**。这种方式是通过将父类的实例赋值给子类的原型来实现的。例如： ```javascript function Person(name...

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