目录
前言
1 对象的创建
1.1 单一创建的方式
1.2 构造函数创建方式
2 对象中的组成元素
3 在对象中的ProtoType功能说明
4 对象继承
前言
在javaScript中,对象为属性的集合,但JavaScript中的对象和我们经常接触到的面向对象语言Java,C# 不一样的,后者是基于类,而JavaScript是基于原型的语言,在javasript 中,对象中包含了自身的一个自身的prototype,写到这我们就有一个疑问,在JavaScript中对象组成的结构是什么呢
Object 对象 | |||||
属性1 | 属性值1 | ||||
属性2 | 属性值2 | ||||
prototype properties | |||||
constructor | function Create()
|
Object对象结构图
上面是JavaScript中的object对象结构图,对于具体的细节在这边就不一一细说了
1 对象的创建
1.1 单一创建方式
单一创建方式的应用场景为在应用域中我们只需要一个对象实例,这就和我们常用的singleton模式有相似之处.
//定义对象
Var singletonObject= {
Name:’macroxu’,
ShowName:function{
Alert(this.Name);
}
}
//调用方式
singletonObject.ShowName();
1.2 构造函数创建的方式
在跟多的情况下我们需要同一类型的多个对象时,我们就需要用构造器,和new的方式来定义并生成对象了
//定义对象
var Animal =function(){
this.Name='No define Name ';
this.Age=0;
this.Move=function(){alert(this.Name+' is Moving');}
}
//调用的方法
dog = new Animal();
dog.Name ='pipi';
dog.Age =5;
dog.Move();
2 对象中的组成元素
在 JavaScript中对象和function函数是几乎对等的,在对象中可以包含自定义变量,或者
对应的函数。在对象的中属性运行时可以动态添加,这是源于JavaScript是一种解析性语言。
下面是在Animal对象,在运行时动态添加一个行为Print.
//创建Animal对象 dog
dog = new Animal();
dog.Name ='pipi';
dog.Age =5;
dog.Move();
//这是运行时,动态添加的行为 Print
dog.Print=function(){alert('this is Added function in runtime');};
dog.Print();
3 在对象中的ProtoType功能说明
ProtoType 是指对象所对应的原型,ProtoType 中包含了特定的类型对象的一系列的属性,
比如 dog对象的ProtoType 为Animal,在dog的ProtoType中包含了三个对象,Age,name,行为Move。
在这里面我们很自然的想起了设计模式中的原型模式。在原型模式中,客户调用原型模式 是为了获得一个对象的clone对象,但是这和JavaScript中的原型是不一样的,JavaScript中的ProtoType是作为新生成的object的组成的一部分,在生成的Object,将通过原型列表指向对应的原型ProtoType。
在实际的运用中,ProtoType能给我们带来哪些功能呢
3.1 设计共享的方法
我们现在要在Dog的ProtoType中添加一个共享方法 AddOneYear 给动物加一岁。
//给原型中添加一个AddOneYear 行为
Animal.prototype.AddOneYear=function(){this.Age+=1; };
//给狗对象 增加一岁
dog.AddOneYear();
alert(dog.Age);
4 对象继承
现在我们定义一个horse对象继承了Animal,并且包含了Horse的属性HorseColor
var horse =function(){
this.HorseColor ='red';
}
horse.prototype=new Animal();
WhiteHorse =new horse();
WhiteHorse.HorseColor ='White';
WhiteHorse .Age =4;
WhiteHorse.Name ='闪电';