javascript中定义类的方法

JavaScript被一些人称为基于对象而非面向对象的编程语言,在有些JavaScript的书籍中也没有面向对象编程的相关内容。但是在JavaScript高级程序设计(人民邮电出版社)中,详细介绍了JavaScript面向对象编程的方法。现将JavaScript中定义(创建)类的方法总结如下。这些方法虽然跟传统的OOP语言中类的定义还是有些区别,但是足矣满足JavaScript中面向对象的需要。目前使用最广泛的是混合的构造函数/原型方法,动态原型方法也很流行,在功能上与构造函数/原型方式等价。可以采用这两种方式中的任何一种。
<script type="text/javascript">
<!--
// 此文件说明在js中使用对象、新建对象的方法
//这个是工厂方式
//eval(createmethod5());
function createmethod1(){
 function showColor(){
  alert(this.color);
 }
 function createCar(sColor, iDoors, iMpg){
  var oTempCar = new Object;
  oTempCar.color = sColor;
  oTempCar.doors = iDoors;
  oTempCar.mpg = iMpg;
  oTempCar.showColor = showColor;
  return oTempCar;
 }
 var oCar1 = createCar("red", 4, 23);
 var oCar2 = createCar("blue", 3, 25);
 oCar1.showColor();
 oCar2.showColor();
};

//这个是构造函数方式
function createmethod2(){
 function Car(sColor, iDoors, iMpg){
  this.color = sColor;
  this.doors = iDoors;
  this.showColor = function (){
   alert(this.color);
  }
 }
 
 var oCar1 = new Car("red",4,23);
 var oCar2 = new Car("blue",3,25);
} //此方法以及上面的工厂方法的缺点是 对每个实例化的对象,都有单独的一个 showColor 方法的实例(函数对象).
 //但是也可以跟上面一样,将方法写在外面,实例化对象时传递函数的引用作为方法

//这个是原型方式
function createmethod3(){
 function Car(){
 } //定义构造函数,但是其中无任何代码
 Car.prototype.color = "red";
 Car.prototype.doors = 4;
 Car.prototype.mpg = 23;
 Car.prototype.showColor = function(){
  alert(this.color);
 }

 var oCar1 = new Car();
 var oCar2 = new Car();
} 
//使用这种方法,可以使用 oCar1 instanceof Car 检查给定变量指向的对象类型
//这种方法缺点:构造函数不能有参数,只能实例化之后改变属性的默认值,另外,类的属性指向非函数对象(是属性而非method,如数组)时,多个实例(对象)使用同一个属性,导致错误。

//混合构造函数/原型方式
function createmethod4(){
 function Car(sColor, iDoors, iMpg){
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.drivers = new Array("Mike","Sue");//所有非函数属性(包括数组),都使用构造函数方式定义
 }
 Car.prototype.showColor = function(){
  alert(this.color);
 }; //类的函数属性(方法)使用原型方式定义,在构造函数外边
 
 var oCar1 = new Car("red",4,23);
 var oCar2 = new Car("blue",3,25);
 
 oCar1.dirvers.push("Matt"); //不同对象使用不同的数组属性
} //这种方法是ECMAScript主要采用的方式。

//动态原型方法
function createmethod5(){
 function Car(sColor, iDoors, iMpg){
  this.color = sColor;
  this.doors = iDoors;
  this.mpg = iMpg;
  this.drivers = new Array("Mike", "Sue");

  if (typeof Car._initialized == "undefined"){
   Car.prototype.showColor = function(){
    alert(this.color);
   };
   Car._initialized =true;
  }
 }

 var oCar1 = new Car("red",4,23);
 var oCar2 = new Car("blue",3,25);
 oCar1.showColor();
 oCar2.showColor();
} //这种方法与上面的 混合构造函数/原型方法 的实现方法基本相同,但是将类的属性与方法都放到构造函数内,与传统的OOP语言更为相似。

//混合工厂方式
function creatmethod6(){
 function Car(){
  var oTempCar = new Object;
  oTempCar.color = "red";
  oTempCar.doors = 4;
  oTempCar.mpg = 23;
  oTempCar.showColor = function(){
   alert(this.color);
  };

  return oTempCar;
 }

 var car  = new Car(); //这种方法与工厂函数方法有些相似,但是可以使用new运算符新建对象。
}       //这种方式在对象方法的内部管理与经典方式有着同样的问题,所以还是避免使用这种方式。
//-->
</script>
(注:createmethodx(x=1:6)函数仅为测试方便而将几种方法分隔开,实际方法仅为函数内的代码) 参考资料:JavaScript高级程序设计(英文原版:Professional JavaScript for Web Developers)
posted @ 2010-10-22 16:32  leetom  阅读(214)  评论(0编辑  收藏  举报