js类

面向对象的基础就是定义类,下面是定义一个类的例子，它有属性、方法、静态属性和静态方法。

例：

 

//一个js类

function JsTestClass(privatePara,publicPara)//构造函数

{

   var priBl=privatePara;//私有变量

   this.pubBl=publicPara; //公有变量

   //定义私有方法

   function priMethod()

   {

      return "priMethod()";

   }

   //定义公共方法，不能调用私有变量和方法

   JsTestClass.prototype.pubMethod=function()

   {

      return "pubMethod()";

   }

   //定义特权方法，可访问所有成员

   this.privilegedMethod=function()

   {

      var str="这个是特权方法,我被调用了/n";

      str+="私有变量:"+priBl+"/n";

      str+="公有变量:"+this.pubBl+"/n";

      str+="私有方法:"+priMethod()+"/n";

      str+="公共方法:"+this.pubMethod()+"/n";

      return str;

   }

}

 

//创建JsTestClass实例

var OneJsTest=new JsTestClass("私有变量成员","公有变量成员");

//alert(OneJsTest.priBl);//弹出:undefined

//alert(OneJsTest.pubBl);//弹出:公有变量成员。

//alert(OneJsTest.priMethod());//出错:对象不支持此属性或方法

//alert(OneJsTest.pubMethod());//弹出:pubMethod()

alert(OneJsTest.privilegedMethod());

/*

弹出:

这个是特权方法,我被调用了

私有变量:私有变量成员

公有变量:公有变量成员

私有方法:priMethod()

公共方法:pubMethod()

*/

 

//定义类的方式有很多种：

 

 

/*

============构造函数方式============

该方式在函数内部没有创建对象，是用this关键字，因为在调用构造函数时创建了对象，而在函数内容只能用this

来访问对象属性。

优点：可以根据参数来构造不同的对象实例。

缺点：构造时每个实例对象都会为对象创建自己的方法，造成了内存的浪费。

======================================

<summary>

房子类

</summary>

<param name="numDoor">有多少扇门</param>

<param name="numWindow">有多少个窗</param>

*/

function Houses(numDoor,numWindow)

{

  this.numDr=numDoor;

  this.numWd=numWindow;

  this.getDrAdnWd=function()

  {

     return "这个屋子有"+this.numDr+"扇门,有"+this.numWd+"个窗<br>";

  }

}

var h1=new Houses(1,6);

var h2=new Houses(2,8);

document.writeln(h1.getDrAdnWd()+h2.getDrAdnWd());

/*

输出:

这个屋子有扇门,有个窗

这个屋子有扇门,有个窗

*/

 

//当然你也可以用一个外部函数来代替类方法，达到了每个对象共享同一个方法。改写后的类如下:

function getDrAdnWd()

{

  return "这个屋子有"+this.numDr+"扇门,有"+this.numWd+"个窗<br>";

}

function Houses(numDoor,numWindow)

{

  this.numDr=numDoor;

  this.numWd=numWindow;

  this.getDrAdnWd=getDrAdnWd; //here

}

var h1=new Houses(1,6);

var h2=new Houses(2,8);

document.writeln(h1.getDrAdnWd()+h2.getDrAdnWd());

/*

输出:

这个屋子有扇门,有个窗

这个屋子有扇门,有个窗

*/

 

 

 

 

 

 

 

 

 

 

 

 

 

 

/*

============原型方式============

该方式利用了对象的prototype属性，可把它看成创建新对象所依赖的原型,

所有的属性和方法都被直接赋予prototype属性,使用原型方式时，不能通过给构造函数传递参数初始化属性的值

从语义上讲，所有属性看起来都属于一个对象。

优点：所有对象实例都共享同一个方法（相对于构造函数方式），没有造成内存浪费

缺点：不能通过参数来构造对象实例(一般每个对象的属性是不相同的)

======================================

<summary>

房子类

</summary>

<param name="numDoor">有多少扇门</param>

<param name="numWindow">有多少个窗</param>

*/

function Houses()

{

}

Houses.prototype.numDr="3";

Houses.prototype.numWd="9";

Houses.prototype.getDrAdnWd=function()

{

  return "这个屋子有"+this.numDr+"扇门,有"+this.numWd+"个窗<br>";

}

var h1=new Houses();

var h2=new Houses();

document.writeln(h1.getDrAdnWd()+h2.getDrAdnWd());

/*

输出:

这个屋子有扇门,有个窗

这个屋子有扇门,有个窗

*/

 

//这意味必须在对象创建后才能改变属性的默认值，这点很令人讨厌，

//真正的问题出现在属性指向的是对象，而不是函数时,

//函数共享不会造成任何问题，但对象却很少被多个实例共享的,考虑下面的例子:

 

function Houses()

{

}

Houses.prototype.numDr="3";

Houses.prototype.numWd="9";

Houses.prototype.Include=new Array("砖头","门","窗");

Houses.prototype.getDrAdnWd=function()

{

  return "这个屋子有"+this.numDr+"扇门,有"+this.numWd+"个窗<br>";

}

var h1=new Houses();

var h2=new Houses();

h1.Include.push("磁砖");

document.writeln(h1.Include+"<br>"+h2.Include);

/*

属性Include是指向Array对象的指针,由于Include是引用值,两个实例都指向同一个数组,

输出这两个指针中的任何一个，结果都是一样的

输出:

砖头,门,窗,磁砖

砖头,门,窗,磁砖

*/

 

 

 

 

 

 

 

 

 

 

/*

============构造函数+ 原型直接组装一个类============

======================================

<summary>

工具类

</summary>

<param name="constructor">构造函数</param>

<param name="prototype">方法</param>

*/

function $Class(constructor,prototype)

{

   var c=constructor||{};

   var p=prototype||{};

   //c.prototype=p;

   for(var arr in p)

   {

     c.prototype[arr]=p[arr];

   }

   return c;

}

//构造函数

function Houses(numDoor,numWindow)

{

   this.numDr=numDoor;

   this.numWd=numWindow;

}

//原型对象

var proto=

{

   getDrAdnWd:function(){return "这个屋子有"+this.numDr+"扇门,有"+this.numWd+"个窗<br>";},

   setDrAdnWd:function(numDoor,numWindow){this.numDr=numDoor,this.numWd=numWindow;}

}

//组装得到了两个同一个类型的类

var cnhs=$Class(Houses,proto);

var enhs=$Class(Houses,proto);

 

 

var h1=new cnhs(2,8);

var h2=new enhs(3,9);

document.writeln(h1.getDrAdnWd()+h2.getDrAdnWd());

/*

输出:

这个屋子有扇门,有个窗

这个屋子有扇门,有个窗

*/

 

 

 

 

 

 

 

/*

============构造函数+原型定义一个类============

======================================

<summary>

工具类

</summary>

<param name="constructor">构造函数</param>

<param name="prototype">方法</param>

*/

function $Class(constructor,prototype)

{

  var c=constructor||{};

  var p=prototype||{};

  return function()

  {

    for(var arr in p)

    {

      /*

      arguments表示传入函数的参数

      callee表示函数和函数主体的语句

      caller表示调用该函数的函数

      */

      arguments.callee.prototype[arr]=p[arr];

      c.apply(this,arguments);

    }

  }

}

//构造函数

function Houses(numDoor,numWindow)

{

   this.numDr=numDoor;

   this.numWd=numWindow;

}

//原型对象

var proto=

{

   getDrAdnWd:function(){return "这个屋子有"+this.numDr+"扇门,有"+this.numWd+"个窗<br>";},

   setDrAdnWd:function(numDoor,numWindow){this.numDr=numDoor,this.numWd=numWindow;}

}

//组装得到了两个同一个类型的类

var cnhs=$Class(Houses,proto);

var enhs=$Class(Houses,proto);

 

 

var h1=new cnhs(2,8);

var h2=new enhs(3,9);

document.writeln(h1.getDrAdnWd()+h2.getDrAdnWd());

/*

输出:

这个屋子有扇门,有个窗

这个屋子有扇门,有个窗

*/