面向对象的JavaScript(2):类

时间:2021-05-20 19:51:46

       在小项目中对于JavaScript使用,只要写几个function就行了。但在大型项目中,尤其是在开发追求良好的用户体验的网站中,如SNS,就会 用到大量的JavaScrpt,有时JavaScript的工作量胜过了C#,这时写一堆function,就会显得很乱,杂乱无章,甚至会出现命名冲突,管理和维 护起来都很麻烦。对于这种情况我们就需要使用面向对象的思想来开发JavaScript。那我们就这样作罢:

       在上一节面 向对象的JavaScript(1):命名空间  中说了怎么定义JavaScript命名空间,这一节来说下紧接着的一个概念——类。虽然JavaScript中没有class关键字,但作为开发人员我们一定要有这个思想。在C#中类可以分为实例类和静态类,JavaScript亦然。

  一,定义实例类: 在上节中我定义了一个cnblogs.news的命名空间,现在就在此命名空间下定义一个名为Article类:

cnblogs.news.Article = function (){
    
var  _this = this ;
    
this .title = null ;
    
this .content = null ;
    
this .show = function (){
    document.write( " <h1> " + _this.title + " </h1> " );
    document.write( " <p> " + _this.content + " </p> " );
  }
}

创建对象就和C#一样:

//   实例化一个对象
   var  article  = new  cnblogs.news.Article();
//   给对象的属性赋值
  article.title = " 这是文章标题 " ;  
  article.content = " 这是文章内容 " ;
//   调用对象的方法
  article.show();


二,定义静态类:所谓静态类就是直接调用类的成员,换言之,类的成员是属于类的,不属于对象。同样以Article为例,代码如下:

cnblogs.news.Article = {
    title: " 这是文章标题 " ,
    content: " 这是文章内容 " ,
    show: function (){
            document.write( " <h1> " + cnblogs.news.Article.title + " </h1> " );
            document.write( " <p> " + cnblogs.news.Article.content + " </p> " );
    }
};

 调用方式也和C#类似:

 cnblogs.news.Article.show();

到这里或许你已经发现了,所谓JavaScript静态类其实就是一个json对象,恭喜,答对了! ^_^

 

 三,如何选择
        那么何时选择实例类,何时选择静态类呢,就个人经验而言(说得不对敬请斧正刀正,怎么正都可以^_^),开发一些对dom的依赖比较弱,而要求复用型很强的程序,如工具类,插件类,结构,使用静态类;反之如果程序对dom依赖很强,经常有变量传来传去,或者对类的结构造成变化,这时选用实例类。个人比较推崇第一种方案,其代码风格较之第二种更像C#,我想写惯了C#的同学也会这样觉得的,^_^。

 原文地址:http://www.cnblogs.com/xumingxiang/archive/2010/04/30/1725277.html

作者 : *祥
出处: http://www.cnblogs.com/xumingxiang 
版权:本文版权归作者和博客园共有
转载:欢迎转载,为了保存作者的创作热情,请按要求【转载】,谢谢
要求:未经作者同意,必须保留此段声明;必须在文章中给出原文连接;否则必究法律责任