设为首页
收藏本站
最新电影
您现在的位置: 首页=>后台技术=>脚本特效=>其他 订阅本栏目  
javascript面向对象编程的学习(基础)
时间: 2011-02-14 15:46:44 阅读次数:2479


---->什么是类和对象
这是所有面向对象编程之前必须弄明白的.
所谓类:简单地说就是模板,说的专业一些,是一类具有某种性质的物的集合.
比如:人就是一个类,车也是一个类,等等.
所谓对象:就是类的具体实现.
如上面所说,人是一个类,一个具体的人就是一个对象,比如张三.

对象是类的实例化后的结果.javascript中使用new关键字来实例化一个类,生成一个对象.
例子:

function people(){ //javascript中一个function也是一个类,这里我们建立一个空的类people
}
var zhangsan=new people; //实例化生成一个对象张三


---->一个具体形象的例子


/*-->最简单的类:
*people类
* 属性:性别,年龄,姓名
* 方法:说话
*/
function people(name,sex,age){
this.name=name;
this.sex=sex;
this.age=age;
this.say=function(){
return "我叫"+this.name;
}
}


使用时:

var zhangsan=new people;
alert(zhangsan.say());
var lisi=new people;
alert(lizi.say());

说明:
上面使用了this关键字,this总是指向当前的对象,在上面例子中,zhangsan.say中具有this.name,这里的this是当前的对象zhangsan.后面lisi.say则是指向当前对象lisi
对象具有属性,上面的name,sex和age就是对象的属性.我们这样可以访问,如lisi.name,zhangsan.age
对象还具有方法,比如上面的say.方法是通过构造函数实现的.使用时,如上面,用lisi.say(),zhangsan.say()

当然我们还可以在实例化对象后为对象添加新的属性和方法.比如:

zhangsan.girlfriend="小丽";
zhangsan.doing=function(){
return "I am eating";
}

---->javascript类/对象和其他面向对象语言的异同
相同点:面向对象编程的思想都是一样的,世界上所有的具体事物都可以看成对象,而这些事物从属的集合都可以看成类.我们要做的是构造我们需要的类,在实例化成我们需要的对象为我们工作.
不同点:其他面向对象编程的语言对于类/对象关心下面的事情:
1.作用域:公用,私用,受保护,静态.而javascript只有一种作用域:公用作用域.
2.特性:继承,多态.javascript不支持多态,继承方面的内容将在"javascript对象的继承"一文中介绍

---->构建javascript类/对象的方式
首先,可以大致定义出下面几种类型:
1.工厂方式
2.构造函数方式
3.原型方式
4.混合的构造函数/原型方式
5.动态原型方法
6.混合工厂方式

具体说明:
A.工厂方式:
所谓工厂方式,是指先建立对象,然后再往对象里面添加属性和方法.
eg.1

var zhangsan=new Object; //创建对象
zhangsan.name="张三"; //给对象添加属性
zhangsan.say=function(){ //给对象增加方法
alert("我叫张三");
}

eg.2 上面的例子没有封装性,我们可以使用函数封装,实现多重利用

function people(){
var p_object=new Object;
p_object.name="张三";
p_object.say=function(){
alert("我叫张三");
}
return p_object; //返回对象
}
var zhangsan=people;
var lisi=people;
上面zhangsan和lisi两个对象具有完全相同的属性和方法,都叫"张三"(name属性),都会说"我叫张三"(say()方法)

eg.3 通过传递参数改进eg.2

function people(name){
var p_object=new Object;
p_object.name=name;
p_object.say=function(){
alert("我叫"+this.name);
}
return p_object; //返回对象
}
var zhangsan=people("张三");
var lisi=people("李四");

总结:
工厂方式,总是先创建一个对象,再往对象中添加你需要的属性和方法.但这种做法对于封装性和多种利用性不是很有利,这导致了这种对象的构造方法不被提倡.
使用工厂方式总是为每个对象创建独立的函数版本.
这类方式使用封装然后调用新对象的时候不使用new创建对象.

B.构造函数方式:
所谓构造函数方式,就像我给出的例子"一个具体形象的例子",就是采用构造函数的方式.它和工厂方式的区别是不再在函数内部创建一个对象.而是通过this关键字指向当前对象.
构造函数的例子不再给出.
构造函数和工厂方式一样,会重复生成函数,为每个版本的对象创建独立的函数版本.

C.原型方式
所谓原型方式,就是利用prototype属性来实现属性和方法的继承
eg.1

function people(){
}

people.prototype.name="张三";
people.prototype.say=function(){
alert("我叫"+this.name);
};

var zhangsan=new people();
var lisi=new people();
飞飞As!p技术乐园
原型方式不能通过构造函数传递参数初始化属性的值,因为所有的属性和方法都是通过prototype添加的

D.混合的构造函数/原型方式
对于对象的属性,使用构造函数的方式
对于对象的方法,使用原型方式
eg.1

function people(name){
this.name=name;
}
people.prototype.say=function(){
return "我的名字叫"+this.name;
};

var zhangsan=new people("张三");
document.write(zhangsan.say());

eg.2 我们也可以把prototype写入类,实现视觉上的封装.

function people(name){
this.name=name;
people.prototype.say=function(){
return "我的名字叫"+this.name;
};
}

var zhangsan=new people("张三");
document.write(zhangsan.say());
飞飞Asp技术.乐园
总结:这种构造类/对象的方法是推荐使用的

E.动态原型方式
这是在混合的构造函数/原型方式上改进的一种方式(提供更友好的编码风格),他们功能是等价的
eg.1

function people(name){
this.name=name;
if(typeof people._initialized=="undefined"){
people.prototype.say=function(){
return "我的名字叫"+this.name;
};
people._initialized=true;
}
}
var zhangsan=new people("张三");
document.write(zhangsan.say());
var lisi=new people("李四");
document.write(lisi.say());

这样处理的目的是创建对象的方法后下一次使用时不要再创建.
由于上面的原因,动态原型方式也是javascript中常用的一种创建类/对象的一种方式

F.混合工厂方式
混合工厂方式几乎和工厂方式是一样的.它同样是先构造对象,然后再往对象中添加属性和方法.不同的是,混合工厂方式生成对象时依旧使用new关键字.
eg.1

function people(){
var p_object=new Object;
p_object.name="张三";
p_object.say=function(){
alert("我叫张三");
}
return p_object; //返回对象
}
var zhangsan=new people;
var lisi=new people;
zhangsan.say();
lisi.say();

混合工厂方式和工厂方式以及经典方式(构造函数,原型方式)一样会产生问题,不推荐使用

对各种构建类/对象方式的总结:
通常地,我们使用混合的构造函数/原型方式,即属性使用构造函数方式,方法采用原型方式.当然,加强地,我们可以使用动态原型方式.
上面两种方式是推荐使用的.


---->关于prototype的其他功能
1.给对象(包括本地对象)添加新的方法
比如Array对象,你可能需要添加一个方法toHexString,你可以这样做:
Array.prototype.toHexString=function(){
//code here
}

2.重定义方法
实质是让方法指向一个新的函数
Array.prototype.toHexString=function(){
//other code href




站内搜索    

下一篇javascript面向对象编程的学习---对象继承

上一篇用键盘打开网页代码

本栏目最新 栏目最新列表
xhEditor v1.1.7 发布,国产开源XHTML在线编
收集的一些轻量级非常实用的前端开发小工具
javascript中cookie的设置,读取,删除
jquery插件:飞飞表情插件v1.0_[普通表情/魔
Jquery插件:textarea使用“autoresize”自
网站优化策划 栏目最新列表
增加网站外链的快速方法
网站上线前必做的30个检查
新的友情链接参考标准(没有google的PR情况
优化Google的AdSense广告的五个工具
王通讲SEO八大基础
站点最新 站点最新列表
微博推广的一些技巧
xhEditor v1.1.7 发布,
收集的一些轻量级非常实
50个新鲜兼容最新版本的
javascript中cookie的设
Excel中出现#VALUE!、#D
jquery插件:飞飞表情插件
十个使用HTML5开发的精彩
支持HTML5的浏览器有哪些
飞妮莫属:漫画:如何写出
历史最热10条信息  
MIME介绍 及 [1] [2] [3]
巧用Google和迅雷来下载
VIA Rhine II Fast Ethe
Transact SQL 常 [1] [2]
电脑常用端 [1] [2] [3]
十道羊皮卷 欣赏+mp3版+
Do you get a kick out
每日一句:A friend and
每日一句:Theres no tu
网站开发常用手册
相关专题 相关专题列表
Javascript面向对象编程
Javascript面向对象编程
Javascript 面向对象编程
javascript面向对象编程
javascript面向对象编程
JavaScript constructor
 width= 
伟哥博客 西安房产 123最新电影 三四六四