javascript 学习笔记3-构造函数、类和原型

3.　构造函数、类和原型

　　总述：

　　对象是我们很熟悉的，常在程序中用它。那么，如何来区分一个对象与另一个对象的区别呢？类就做到了这点，对象是类的一个实例。

　　Js中的类与java的类不太一样，但是它构造函数和原型来来支持类。

　　3.1构造函数

　　我们在程序里使用对象时常常先new一个object，然后再给这个object赋属性，然后再使用这个object来实现我们想要的功能。很经常的，new一个无参数的object,我们这样写：

　　Js代码

双击代码全选

1

var　o　=　{};

　　其实它的实现与下面的代码是一样的：

　　Js代码　　

双击代码全选

1

var　o　=　new　object();　

　　在后面的写法中，new 后面的object()就是一个构造函数，就像在程序里我们常常自定义构造函数，设置它的prototype，再new一样。那么什么是构造函数呢？

　　构造函数是设计来和new一起使用的函数。new后，就把新的对象作为this关键字的值来传递了。

　　构造函数的作用是什么呢？它是初始化一个新创建的对象，设置在使用这个对象之前的所有属性。

　　可以定义自己的构造函数（常用），只需要编写一个为this添加属性的函数就可以了。如下的例子：

　　Js代码

双击代码全选

1

2

3

4

5

6

function　Rectangle(w,h){　

　this.w　=　w;　

　this.h　=　h;　

}　

var　rec1　=　new　Rectangle(1,1);//var　rec1　=　{w:1,h:1}　

var　rec1　=　new　Rectangle(2,2);//var　rec2　=　{w:2,h:2}　

　　以上代码注意：

　　1、　注释里的效果也是一样的。那么我们为什么还要定义构造函数呢？构造函数方便你new多个对象，而注释里的写法是只需要使用一次这样的对象。

　　2、　从上面的代码可以看出：通过定义一个函数（构造函数），其实就定义了对象的一个类。

　　3、　上述类new的对象，都保证了初始化了w和h的值。根据传入构造函数的w和h的数值的不同，可以得到不同w和h值的对象，但这些对象都有相同的属性（如计算面积的方法都相同等）。

　　3.2原型与继承

　　在上面代码的例子中，我们如果要计算rec1这个对象的面积，需要这样做：

　　Js代码

双击代码全选

1

2

3

4

rec1.area　=　function(){　

　return　this.w　*　this.h　

}　

var　a　=　rec1.area();　

　　在上面这种情况下，如果rec2也要得到它的面积，也要定义一个它自己的area函数值。其实，所有的rectangle对象的计算面积的方法是一样的，我们可以把这个方法写在构造函数里。如下：

　　Js代码　　　

双击代码全选

1

2

3

4

5

function　Rectangle(w,h){　

　this.w　=　w;　

　this.h　=　h;　

　this.area　=　function(){this.w*this.h}　

}

　　这时候用这个新的构造函数后new的对象就可以直接用rec1.area()来得到它的面积了。

　　但是这里引出了一个问题，什么问题呢？

　　如果用上面的构造函数的放，每new一个矩行对象，都会初始化三个属性，这三个属性中除了w和h是每个对象不同的，area属性却是每个对象都指向同一个函数functiion。

　　这就引出了原型。可以把area方法放在这个类的原型对象里。

　　1、原型对象的任何属性，都表现为以它为原型的对象的属性。这句话比较难理解，好好理解一下，其实它说的是js中的对象都从它的原型里继承属性。

　　2、当我们new一个对象时，其实在内部也设置了这个对象的原型，这个对象的原型就是它的构造函数的prototype的值。

　　3、所有的函数都有一个prototype属性。也就是你定义一个函数后，prototype就被自动创建和初始化了。

　　4、增加给原型的任何属性，都会成为被构造函数初始化的对象的属性。

　　如上面的例子中，我们可以这样写：

　　Js代码　　

双击代码全选

1

2

3

4

5

6

7

8

9

function　Rectangle(w,h){　

　this.w　=　w;　

　this.h　=　h;　

}　

Rectangle.prototype={　

　area:function(){　

　return　this.w　*　this.h　

　}　

}

　　上面的代码中，w和h在每个对象实例中都不同；把area属性放在原型里说明了：原型对象与构造函数相关，并且用构造函数new出来的每个实例对象都从原型那里继承了一份相同的一组属性。

这也说明了，原型对象是放置方法和其它不变属性的理想的地方。

　　原型的概念也就引出了继承这个概念。

　　使用原型有两个好处：

　　1、　使用原型可以减少每new一个对象所占有的内存，因为new的不同的对象可以同时继承原型的不同的属性。

　　2、　即使是对象创建之后才增加到原型中的方法，对象也继承它。这就说明：可以为已有的类添加新的方法。

　　第二点常用，比如某个类是别人写好的，或是内建的，你需要扩展它，就可以增加一个这个类的prototype的属性。（但是对于内建类，最好不要这么做，因为你扩展了，所有的这个类的实例都会因此而多个属性）

　　3.3 继承的属性的读和写

　　我们知道：每个类都有原型对象，原型对象带有一组属性，这组属性可以被这个类的所有多个实例所继承。所以，在读一个类的属性和写一个类的属性时，需要执行一种不对称。也就是当读一个o的p属性时，会先到o中看是否有p的属性，如果没有，则到原型中去看。但当写一个o的p属性值时，并不用原型。为什么呢？因为如果用原型的话，会改变整个类对象的p的值。

　　因此，属性继承只在读取属性值时发生，而在写入属性值时不发生。因此，如果我们设置了o的p的值，而当这个p是从原型那里继承来的时，其实o会直接在自身创建出一个p属性。这样，当读取p属性值时，就不需要到原型中去找，只需要读取出自身的p属性的值就好了。这就好像o的属性p“遮盖”或“隐藏”了原型对象中的属性p。例子如下：

　　Js代码　　　

双击代码全选

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

function　Circle(x,y,r){　

　this.x　=　x;　

　this.y　=　y;　

　this.r　=　r;　

}　

Circle.prototype={　

　pi　:3.1415926,　

　area:funciton(){　

　return　this.pi*this.r*this.r　

　}　

}　

var　c1　=　new　Circle(1,1,1);　

var　c2　=　new　Circle(2,2,2);　

//　

c1.area();//area并不在c1中，从原型中去找，就好像这是c1自身的属性一样。这种写法我们在程序中很常用。　

c1.pi　=　4;//设置pi的值，pi在原型中，并不在c1自身的属性中，它把作为c1的一个自身的新属性来创建。改变原型的属性值，这种情况比较少，我们一般去读取它。　

var　a=　c1.pi*c1.r*c1.r//这时候，pi和r都在c1自身内有。　

var　a=　c2.pi*c2.r*c2.r//这时候，pi在c2的原型里去读，r都在c2自身读取。　

因为原形属性是一个类的所有对象共享的属性，所以原型成为定义方法的理想场所。

　　3.4 Js中模拟类：

　　我们知道，对象是包含各种具有名字的数据片断的数据结构，也可以包含对这些数据片断进行操作的方法。对象把相关的值和方法组织到一起，这样增强了代码了模块性和可复用性，使得编程更加容易。

　　Js中的对象可以有任意多的属性，且属性可以动态地添加，但java的对象就不是这样，java中的每一个对象都有组预定义的属性，这些属性并不能动态地添加的。

　　在java的类中，确切地指定了字段，及方法的同时，会有一个类方法名，但是js不会有一个正式的类名，它只是通过构造函数和原型来模拟类。

　　Js和java的类都可以有多个对象，一个对象就是类的一个实例。

　　一个java类的类成员有实例属性、实例方法、类属性、类方法。下面分别来说明：

　　实例属性：

　　每个对象都拥有它的实例属性的一份拷贝，实例属性都是通过对象来访问。如：

　　r1.w

　　在Retangle类中，每个Retangle对象都有一个w属性指定了它的宽度。

　　默认情况下，js的任何对象属性都是一个实例属性。然而为了真实地模拟面象对象的类，我们说实例属性是由构造函数创建和初始化的属性。

　　实例方法：

　　实例方法在特定的对象上被调用。如：

　　r1.eara()

　　实例方法里通过this来引用调用它的对象。我们千万不要理解成实例方法是每个对象都有一份自己的私有拷贝，实例属性是每个对象都有有一份自己的私有拷贝，但实例方法却相反，这是每个对象所共享的。我们一般把实例方法放在构造函数的原型上来定义，通过这种方式，这样，通过这个构造函数实例化的对象都共享和继承了这个方法。

　　类属性：

　　类属性是与一个类自身相关的属性，而不是和这个类的每个实例相关的属性。类属性通过自身来调用。

　　不管创建了多少份这个类的实例，类属性只有一份。类属性本质上是全局的。

　　在js里，我们通过定义构造函数的自身的一个属性来定义类属性。

　　类方法：

　　类方法是与一个类自身相关，而不是与类的实例相关的方法。类方法通过自身来调用。

　　要定义一个类方法，只需要把这个相应的函数定义成为构造函数的一个属性就可以了。

　　类方法的this并不指向类的任何具体的实例，而是引用构造函数自身。

　　代码例子如下：

　　Js代码　　　

双击代码全选

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

functinn　Circle(x,y,r){　

　//这里的x,y,r都是实例属性　

　this.x　=　x;　

　this.y　=　y;　

　this.r　=　r;　

}　

//这里的pi是类属性　

Circle.pi　=　3.1415　

　

Circle.prototype={　

　//area()方法是实例方法　

　area:function(){　

　return　Circle.pi　*　this.r*this.r　

　}　

}　

//max()方法是个类方法，传入a和b两个类实例进行比较，并征对某个具体的实例　

Circle.max　=　function(a,b){　

　if(a.r>b.r)　return　a;　

　else　return　b;　

}　

　

参考资料：http://tech.ddvip.com/2009-09/1252246981131153_2.html