初学JavaScript

     最近在学JavaScript,买了本《JavaScript高级程序设计》,(以下部分代码来自原书),针对JavaScript的对象基础,最另我感兴趣的是它的prototype对象,我觉得,单单是这样的一个对象,却让JavaScript语言充满了活力。

      在JavaScript中,定义类或对象,最原始的办法就是运用工厂方式,编写下面代码:

 

JavaScript代码
<script type="text/javascript">
function createCar(color, doors, mpg) {
var tempcar = new Object;
tempcar.color
= color;
tempcar.doors
= doors;
tempcar.mpg
= mpg;
tempcar.showColor
= function () {
alert(
this.color)
};

return tempcar;
}

var car1 = createCar("red", 4, 23);
var car2 = createCar("blue", 3, 25);
car1.showColor();
//outputs "red"
car2.showColor(); //outputs "blue"


</script>

 

 

      但对于有一定面向对象基础的程序员来说,这样定义一个类以及创建该类的对象,语义上是那么不正规(它看起来不像使用带有构造函数的new运算符那么正规),更重要的原因在于用这种方式必须创建对象的方法,每次调用函数createCar(),都要创建新函数showColor(),意味着每个对象都有自己的showColor()版本。(作者说:事实上,每个对象都共享了同一个函数。这句话的理解我可不可以这样理解:虽然每个对象都创建了自己的showColor()版本,但实际上只共享了其中的一个函数版本,其他的都没被用上,单单占用着内存罢了。如有错误请高手指出)当然,若一个方法规模比较大,那确实是浪费了很大的内存,存在严重的功能问题。

      比较普遍的办法就是运用混合的构造函数/原型方式,这个概念非常简单,即用构造函数定义对象的所有非函数属性(即类属性),用原型方式定义对象的函数属性(即类方法)。结果所有的函数只创建一次,而每个对象都具有自己的对象属性实例。重写前面的例子,代码如下:

JavaScript代码
<script type="text/javascript">
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.drivers.push(
"Matt");

alert(oCar1.drivers);
//输出 "Mike,Sue,Matt"
alert(oCar2.drivers); //输出 "Mike,Sue"

</script>

现在就更像创建一般对象了。很佩服能想出如此办法的人。

当然还有更另面向对象程序员感觉舒服的动态原型方法,该方法模仿了大多数面向对象语言对属性和方法进行了视觉上的封装。下面用动态原型方法写Car类:

代码
<script type="text/javascript">
function Car(sColor, iDoors, iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.drivers = new Array("Mike", "Sue");

if(typeof Car._initalized == "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.drivers.push(
"Matt");

alert(oCar1.drivers);
//输出 "Mike,Sue,Matt"
alert(oCar2.drivers); //输出 "Mike,Sue"

</script>

该方法之创建并赋值一次,传统的OOP开发者会高兴的发现,这段代码看起来更像其他语言中的类定义了。哈哈。。。。。。对于天天写Java程序的我来说,这在代码语义理解以及代码视觉上感觉是非常舒服的。

以上这些代码对于有一定程序基础的读者来说是很容易理解了,但是,对于初次接触JavaScript的我来说,最最好奇的就是prototype这个对象了,感觉有点理解不清楚

也不知道作者后面有没有进行更深入的介绍。反正在这之前,作者对prototype这一对象没有进行只言片语的解释(老外技术是好,写书就是这么没逻辑,明显prototype要先介

绍下嘛!)。于是我上网找了些资料看看,发现了一篇写的很好的博文,看了这篇文章,让我对prototype有了初步的认识。现给出原文链接:http://ivanl.javaeye.com/blog/53537

  JavaScript是一门很漂亮的语言,用它编写出各种各样的库和框架实现了很多华丽的用户体验效果,JQuery更是在众多框架中脱颖而出。几十KB的jQery.js库却实现了那么多的功能。真佩服作者的代码设计能力,而这一切一切得基础都是JavaScript语言本身。我要认真把它学好。。。。。。继续好好学习它。

posted @ 2009-12-02 22:26  Aqian  阅读(227)  评论(0编辑  收藏  举报