javascript面向对象程序设计高级特性经典教程(值得收藏)
本文实例讲述了javascript面向对象程序设计的高级特性。分享给大家供大家参考，具体如下：
1.创建对象的三种方式：
第一种构造法：new Object
vara=newObject(); a.x=1,a.y=2;
第二种构造法：对象直接量
varb={x:1,y:2};
第三种构造法：定义类型
functionPoint(x,y){
this.x=x;
this.y=y;
}
varp=newPoint(1,2);
2.访问对象
访问对象的属性
中括号表示法：hero['name']。、
点号表示法：hero.name。
如果访问的属性不存在，会返回undefined。
访问对象的方法
方法名后加一对括号：hero.say()。
像访问属性一个访问方法：hero['say']()。
3.删除属性与方法
//创建一个空对象
varhero={};
//为hero对象增加属性和方法
hero.name="JavaScript";
hero.value="helloworld";
hero.sayName=function(){return"hello"+hero.name;};
//测试
alert(hero.name);//outputjavascript
alert(hero.sayName());//outputhellojavascript
//删除hero对象的name属性
deletehero.name;
//测试
alert(hero.sayName());//outputhelloundefined
4.使用this值
//创建一个空对象
varhero={};
//为hero对象增加属性和方法
hero.name="javascript";
hero.value="helloworld";
hero.sayName=function(){return"hello"+this.name;};
//测试
alert(hero.name);//outputjavascript
alert(hero.sayName());//outputhellojavascript
总结：
①这里的this实际上引用的是“这个对象”或“当前对象”。
②this的用法，大部分人的使用问题都比较多。所以不建议过多使用！
5.内建对象
内建对象大致上可以分为三个组：
①数据封装类对象——包括Object、Array、Boolean、Number和String。这些对象代表着javascript中不同的数据类型，并且都拥有各自不同的typeof返回值，以及undefined和null状态。
②工具类对象——包括Math、Date、RegExp等用于提供遍历的对象。
③错误类对象——包括一般性错误对象以及其他各种更特殊的错误类对象。它们可以在某些异常发生时帮助我们纠正程序工作状态。
6.Object对象
Object是javascript中所有对象的父级对象，这意味着所有对象都继承于Object对象。
创建一个空对象：
varobject={};
varobj=newObject();
7.Array对象
Array对象用于在单个的变量中存储多个值。
创建一个空Array对象：
varobject={};
varobj=newArray();
例如1：
//反转字符串示例
//定义一个字符串
varstr="a,b,c,d,e,f,g";
//利用String对象的split()方法，将字符串切割成一个数组
vararr=str.split(",");
//利用Array对象的reverse()方法，将数组中元素的顺序颠倒。
arr=arr.reverse();
//测试打印
alert(arr.toString());
8.String对象
String对象与基本的字符串类型之间的区别：
varstr="hello";
varobj=newString("world");
alert(typeofstr);//typeofstring
alert(typeofobj);//typeofobject
例如1：
//判断字符串是否包含指定字符串示例
//定义两个要判断的字符串
varstr="abcdefg";
varsubstr="efg";
/*
*定义判断字符串是否包含指定字符串的函数
**第一个参数：要判断的字符串
**第二个参数：指定的字符串
*/
functionsub(str,substr){
//将判断的字符串定义成String对象
varstring=newString(str);
//截取判断的字符串
varresult=string.substr(string.indexOf(substr),substr.length);
/*
*判断截取后的字符串是否为空
**为空，说明不包含指定字符串
**不为空，说明包含指定字符串
*/
if(result==substr){
returntrue;
}else{
returnfalse;
}
}
alert(sub(str,substr));
9.原型(prototype)
函数本身也是一个包含了方法和属性的对象。而现在我们要研究的就是函数对象的另一个属性——prototype。
利用原型添加方法与属性
利用自身属性重写原型属性
扩展内建对象
利用原型添加方法与属性
下面创建一个新的函数对象，并设置一些属性和方法：
functionHero(name,color){
this.name=name;
this.color=color;
this.whatareyou=function(){
return"Iama"+this.color+""+this.name;
}
}
varhero=newHero("javascript","red");
alert(hero.whatareyou());//outputIamaredjavascript
为上面的Hero函数对象增加一些属性和方法：
Hero.prototype.price=100;
Hero.prototype.rating=3;
Hero.prototype.getInfo=function(){
return"Rating:"+this.rating+",Price:"+this.price;
}
alert(hero.getInfo());//outputRating:3,Price:100
上面的方式，也可以这样去做：
Hero.prototype={
price:100,
rating:3,
getInfo:function(){
return"Rating:"+this.rating+",Price:"+this.price;
}
};
利用自身属性重写原型属性
如果对象的自身属性与原型属性同名该怎么办呢？答案是对象自身属性的优先级高于原型属性。
functionHero(){
this.name="jscript";
}
Hero.prototype.name="javascript";
varhero=newHero();
alert(hero.name);//outputjscript
deletehero.name;
alert(hero.name);//outputjavascript
扩展内建对象
//为原型Array对象增加一个判断的函数
Array.prototype.inArray=function(color){
for(vari=0,len=this.length;i<len;i++){
if(this[i]===color){
returntrue;
}
}
returnfalse;
}
//定义一个Array对象
vara=["red","green","blue"];
//测试
alert(a.inArray("red"));//true
alert(a.inArray("yellow"));//false
10.继承
如果两个类都是同一个实例的类型，那么它们之间存在着某些关系，我们把同一个实例的类型之间的泛化关系称为“继承”。
继承关系至少包含三层含义：
①子类的实例可以共享父类的方法。
②子类可以覆盖父类的方法或扩展新的方法。
③子类和父类都是子类实例的“类型”。
在javascript中，并不支持“继承”。也就是说，javascript中没有继承的语法。从这个意义上来说，javascript并不是直接的面向对象语言。
11.原型链
原型链是ECMAScript标准制定的默认继承方式。
例如：
functionA(){
this.name="a";
this.toString=function(){returnthis.name};
}
functionB(){
this.name="b";
}
functionC(){
this.name="c";
this.age=18;
this.getAge=function(){returnthis.age};
}
B.prototype=newA();
C.prototype=newB();
解释说明：
将对象直接创建在B对象的prototype属性中，并没有去扩展这些对象的原有原型。
通过newA()另创建了一个新的实体，然后用它去覆盖该对象的原型。
javascript是一种完全依靠对象的语言，其中没有类（class）的概念。
因此，需要直接用newA()创建一个实体，然后才能通过该实体的属性完成相关的继承工作。
完成这样的继承实现之后，对A()所进行的任何修改、重写或删除，都不会对B()产生影响。
只继承于原型：
functionA(){}
A.prototype.name="a";
A.prototype.toString=function(){returnthis.name};
functionB(){}
B.prototype=A.prototype;
B.prototype.name="b";
functionC(){}
C.prototype=B.prototype;
C.prototype.name="c";
C.prototype.age=18;
C.prototype.getAge=function(){returnthis.age};
对象之间的继承（扩展内容，可以不会）（浅复制）
//该函数接受一个对象并返回它的副本
functionextendCopy(p){
varz={};//定义一个空的对象z
for(variinp){//vari=0;i<p.length;i++
z[i]=p[i];//都当做数组处理的话，可以理解
}
//uber属性：将p作为z的父级，将z指向p的原型
z.uber=p;
returnz;
}
//定义对象a，但是对象a不是函数对象
vara={
name:"a",
toStr:function(){returnthis.name;}
}
//定义对象b，但是对象b不是函数对象
varb=extendCopy(a);
b.name="b";
b.toStr=function(){returnthis.uber.toStr()+","+this.name;};
//定义对象c，但是对象c不是函数对象
varc=extendCopy(b);
c.name=18;
alert(c.toStr());//outputa,b,18
PS:教程中不少代码排版不太规范，小编这里推荐几款本站javascript代码格式化美化工具供大家使用：
JavaScript代码格式化工具：
http://tools.jb51.net/code/js
JavaScript代码美化/压缩/格式化/加密工具：
http://tools.jb51.net/code/jscompress
jsmin在线js压缩工具：
http://tools.jb51.net/code/jsmincompress
更多关于JavaScript相关内容可查看本站专题：《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。