Javascript中prototype的使用详解
先看下面一段代码:
functionMachine(ecode,horsepower){ this.ecode=ecode; this.horsepower=horsepower; } functionshowme(){ alert(this.name+""+this.ecode+""+this.horsepower); } varmachine=newMachine("code1",15); machine.name="machine1"; machine.showme=showme; machine.showme();
这样一段代码,虽然建立了一个Machine对象后,通过machine.showme=showme;使得showme函数变成了Machine对象machine的方法。
但是,就看上面两个函数(一个是对象的构造函数,一个是普通方法)没有任何关系,这样的代码,不是那么“优雅“,因此,便有了prototype。
//机器 functionMachine(ecode,horsepower){ this.ecode=ecode; this.horsepower=horsepower; } //特别注意这一句,Machine.prototype是第一次初始化的时候就初始化好的, //当调用Machine作为构造函数的时候,engine的值不会再改变 Machine.prototype.engine=this.ecode+""+this.horsepower; Machine.prototype.showme=function(){alert(this.name+""+this.ecode+""+this.horsepower);}
利用以上代码,所有的Machine对象就有了showme方法了。
但是要特别注意:
prototype只是面对实例的,而不是面对类对象的。(js中,类本身就是一个对象)所以Machine.showme();会报错误,因为Machine这个对象是没有showme方法的。
那么,我们怎么使用showme方法呢?必须得新建一个Machine实例,只有Machine实例才会有这个方法。
varmachine=newMachine("code1",15); machine.name="machine1"; machine.showme();//输出machine1code115。
有了prototype之后,我们更加容易实现继承关系。比如我现在写一个Car类,需要继承目前这个Machine类,只需要写如下代码即可:
//小汽车 functionCar(name,ecode,horsepower){ this.name=name; //调用父类的构造函数,使得Car的对象有ecode、horsepower属性 Machine.call(this,ecode,horsepower); } //Car的原型指向Machine,使Car对象有Machine原型的任意属性和方法,比如showme Car.prototype=newMachine();
这里如何调用父构造函数,以及如何获得父类的原型,注释的都很清楚,就不在赘述了。
然后,我们可以新建一个对象测试一下:
//新建一个类Car的对象。 varxiali=newCar("xiali","aaa",15); alert(xiali.engine); xiali.showme();
以上,是prototype的基本应用,但是也是prototype的最主要的应用。
掌握的prototype的使用,在以后的过程中,对于对象的构建和继承,会有更深层次的理解。
查看更多JavaScript的语法,大家可以关注:《JavaScript参考教程》、《JavaScript代码风格指南》,也希望大家多多支持毛票票。