您的位置：首页 > Web前端 > JavaScript

以一个最简单的例子把OO的JavaScript说明白[转]

2010-09-06 15:08 651 查看

以一个最简单的例子把OO的JavaScript说明白[转]

以一个最简单的例子把OO的JavaScript说明白OO的JavaScript并不高深，麻烦就麻烦在google出来的国人介绍文章经常罗罗嗦嗦，而且之间的说法还各有不同，摆在一起就让人看了头大。
这里重拾简单主义，以一个最简单的例子把OOJavascript说明白。

1.一个颇为精简的例子

只需理解三个关键字:
第一个是function，JS世界里Class的定义用'function'，function里面的内容就是构造函数的内容。
第二个是this指针，代表调用这个函数的对象。
第三个是prototype，用它来定义成员函数，比较规范和保险。

viewsource

print?

01
//定义Circle类，拥有成员变量r，常量PI和计算面积的成员函数area()
02
function
Circle(radius)
03
{
04
this
.r=radius;
05
}
06
07
Circle.PI=3.14159;
08
Circle.prototype.area=
function
(){
09
return
Circle.PI*
this
.r*
this
.r;
10
}
11
12
//使用Circle类
13
var
c=
new
Circle(1.0);
14
alert(c.area());
另外成员函数定义还可以写成这样:

viewsource

print?

1
function
compute_area(){
2
return
Circle.PI*
this
.r*
this
.r;
3
}
4
Circle.prototype.area=compute_area;
2.继承

注意两点
1)定义继承关系ChildCircle.prototype=newCircle(0);其中0是占位用的
2)调用父类的构造函数

viewsource

print?

01
this
.base=Circle;
02
this
.base(radius);
03
04
//定义ChildCircle子类
05
function
ChildCircle(radius){
06
this
.base=Circle;
07
this
.base(radius);
08
}
09
10
ChildCircle.prototype=
new
Circle(0);
11
function
Circle_max(a,b){
12
if
(a.r>b.r)
return
a;
13
else
return
b;
14
}
15
16
ChildCircle.max=Circle_max;
17
18
//使用ChildCircle子类
19
var
c=
new
ChildCircle(1);
20
var
d=
new
ChildCircle(2);
21
var
bigger=d.max(c,d);
22
alert(bigger.area());
3.var式定义

JS还支持一种varCircle={raidus:1.0,PI:3.1415}的形式，语法就如CSS的定义。
因此如果Circle只有一个实例，下面的定义方式更简洁：

viewsource

print?

01
var
newCircle=
02
{
03
r:1.0,
04
PI:3.1415,
05
area:
function
(){
06
return
this
.PI*
this
.r*
this
.r;
07
}
08
};
09
10
alert(newCircle.area());
可以看看Rails带的OOJavascript库--Prototype
其实，Javascript现在的语法真的不适合那么别扭的写成OO模式....

本文链接http://unmi.cc/simple-oo-javascript-sample,来自隔叶黄莺Unmi'sBlog
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航