代码改变世界

javascript学习(5)——[基础回顾]类_2_类的原型模式

2013-11-16 16:15  低调de草原狼  阅读(143)  评论(0编辑  收藏  举报

javascript类的原型模式,我想在这里简单的说一下,javascript本身不像java一样有着严格的继承,我们说javascript的继承,也是我们仿面向对象语言仿出来的,所以javascript虽然支持面向对象的编程,但是我们并不认为javascript是一种很好的面向对象的编程语言。

那么javascript的面向对象是如何实现的呢?

首先先简单说下prototype是每个类可以直接调用的,这个就可以说成是javascript的类的原型,当然这牵扯到原型链这种设计模式,当然我们以后会介绍到;

而__proto__是每个对象可以直接调用的原型。

那么我们取到原型有什么样的好处吗?

其实好处就是我们可以实现继承,另一种意思就是说,我们可以通过将这个类的原型指向某个对象,或者某个对象的原型,从理解层面上来说,我们可以理解为,将这个对象的引用指向了我们=右边的对象,所以这样的话,就比较好理解了,待会结合代码会有一些图供大家理解,如果不理解,可以留言讨论。

代码和注释如下:

/**
 * javascript原型模式(prototype)
 * 1.原型是一个对象,其他的对象可以通过他实现属性的继承
 * 所有的对象在默认的情况下都有一个原型,因为原型本身也是对象所以一个类的真正
 * 原型是被类的内部的[Prototype]属性所持有.
 * 2.什么可以称之为对象
 * 在javascript一个对象就是任何的无序的键值对的集合 function | var a = {}
 * 如果它不是一个主数据类型(undefined,null,boolean,number,String)
 * 其他的通通叫做对象
 */
(function(){
	/**
	 * javascript中的原型(prototype)是和函数(function紧密连接的)
	 * var o = {} 他不是用function 他有原型吗?
	 * 答:
	 * 必须的
	 * 每一个通过new操作符生成出来的对象都持有一个属性__proto__,
	 * 这个属性保存了创建他的构造函数的prototype的原型的引用
	 */
	function person(){}//定义一个空对象
	person.prototype.name = "USPCAT.COM";
	person.prototype.showName = function(){
		//这个this表示调用本函数的一个具体实例化的类
		alert(this.name);
	}
	new person().showName();
	
	var cat = {};//cat空类
	//默认隐藏的调用下面的代码
	Object.getPrototypeOf(cat).name = "MAOMI";//通过getPrototypeOf这个函数可以直接得到对象的上一级原型链
	cat.__proto__.master = "USPCAT.COM";
	//测试、//隐式调用上边的方法
	cat.age = 2;
	cat["sex"] = "MAN";
	alert(cat.name +"  "+cat.age+" "+cat["sex"]+" "+cat.master)
	
	/**
	 * 利用原型模式实现见的继承
	 * 
	 */
	function per(){
		this.getName = function(str){
			alert(str)
		}
	}
	per.prototype.getAge = function(age){
		alert(age)
	}
	var a = {};//空类    a是对象
	a.__proto__ = per.prototype;
	a.getAge(2);
	//a.getName("YUNFENGCHENG")
	
	
	/**
	 * 简单方式实现继承
	 * JS中是无法是实现多继承
	 */
	var b = {};
	b.__proto__ = new per();
	//改变constructor函数
	b.__proto__.constructor = b;
	b.getAge(1)
	b.getName("JAVASCRIPT")
//	class a{
//	}
//	class B extend A{
//		public B(){
//			super()
//		}
//	}
	/**
	 * 串连继承
	 */
	function m(){
		this.showM = function(){
			alert("IM IS M")
		}
	}
	function n(){
		this.showN = function(){
			alert("IM IS n")
		}
	}	
	function k(){};
	n.prototype = new m();
	n.prototype.constructor = n;
	
	k.prototype = new n();
	k.prototype.constructor = k;
	
	var boo = new k();
	boo.showM();
	boo.showN();
})()


这张图,就是说明了我们可以类似理解为继承的时候引用的指向问题


这张图也是


这张图就是说明了串联继承