浅谈javascript类设计模式

下面我主要通过边讲例子边讲优缺点的方式，讲述在JavaScript中如果设计一个类，并得到一个比较合理的类设计模式。
第一个例子：
function car(){
      //构造函数
}
car.prototype.wheel = 3;
car.prototype.run = function(){
     alert("我在跑");
}
car.prototype.stop = function(){
     alert("我停止了");
}
缺点：每定义一个属性或方法，都需要使用一次car.prototype，不仅代码体积变大，而且易读性也不够。

第二个例子：
function car(){
//构造函数
car.prototype.wheel = 3;
car.prototype.run = function(){
      alert("我在跑");
      }
}
car.prototype.stop = function(){
     alert("我停止了");
}
缺点：类可以在function定义的函数体中添加成员，又可以用prototype定义类的成员（属性和方法），代码显得混乱。

第三个例子：
function car(){
//构造函数
car.prototype.wheel = 3;
car.prototype.run = function(){
       alert("我在跑");
}
car.prototype.stop = function(){
      alert("我停止了");
      }
}
缺点：将所有的初始化语句，成员定义放在一起，代码逻辑不够清晰，不易实现复杂的功能；每创建一个类的实例，都要执行一次构造函数。构造函数中定义的属性和方法总被重复的创建。

上面3个例子，可能是你常用的创建类的方法，然而这并不是一个良好的设计模式，在参考了大量书籍和网上的例子后，我们可以得到一个比较好的设计模式：
第四个例子：
function car(){
      //构造函数
}
car.prototype = {
       wheel:3, 
       run:function(){
       alert("我在跑");
       },
stop:function(){
       alert("我停止了");
       }
}

优点：在所定义类内只写构造函数，而成员（属性和方法）使用无类型对象来定义，以列表的方式实现了所有的属性和方法，并且可以在定义的同时初始化属性的值。下面是第四个例子的全部代码：
提示：您可以先修改部分代码再运行，对于jquery等代码需要运行后刷新一次



上一篇：网页中怎样让物体产生投影

下一篇：javascript利用反射取得一个对象的所有属性和方法

留下脚印压缩包密码:sosuo8
名字:
全部评论:
申明:本站部分文章来自网络,由于各种原因对文章的来源无从考究,如果您是“ 浅谈javascript类设计模式 ”的原作者，若侵犯您的版权,请与我联系!在此请您原谅我的幼稚和无知!联系方法：email:ahuinan@21cn.com  QQ:106494262

感谢以下网友对网站提出的建议：
1、感谢“蓝树叶kiss”网友发现一个评论漏洞。(2009-2-28)
2、感谢“陈臣”对程序优化和seo方面的建议。(2009-3-18)
文章档案
  • 作者：阿会楠
  • 来源：搜索吧
  • 日期：2007-10-22 9:23:00
  • 点击：1446
网友投票(您觉得这篇文章怎样？)
loadding...请稍侯......

  

  

实用文章总结
文章阅读排行
随便看看
最新评论