Javascript中prototype的使用详解
时间：2020-12-19 10:09:16|栏目：JavaScript代码|点击： 次
先看下面一段代码：
function Machine(ecode, horsepower) {
this.ecode = ecode;
this.horsepower = horsepower;
}
function showme() {
alert(this.name + " " + this.ecode + " " + this.horsepower);
}
var machine = new Machine("code1", 15);
machine.name = "machine1";
machine.showme = showme;
machine.showme();
这样一段代码，虽然建立了一个Machine对象后，通过machine.showme = showme;使得showme函数变成了Machine对象machine的方法。
但是，就看上面两个函数（一个是对象的构造函数，一个是普通方法）没有任何关系，这样的代码，不是那么“优雅“，因此，便有了prototype。
//机器
function Machine(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实例才会有这个方法。
var machine = new Machine("code1", 15);
machine.name = "machine1";
machine.showme(); //输出machine1 code1 15。
有了prototype之后，我们更加容易实现继承关系。比如我现在写一个Car类，需要继承目前这个Machine类，只需要写如下代码即可：
//小汽车
function Car(name, ecode, horsepower) {
this.name = name;
//调用父类的构造函数，使得Car的对象有ecode、horsepower属性
Machine.call(this, ecode, horsepower);
}
//Car的原型指向Machine，使Car对象有Machine原型的任意属性和方法，比如showme
Car.prototype = new Machine();
这里如何调用父构造函数，以及如何获得父类的原型，注释的都很清楚，就不在赘述了。
然后，我们可以新建一个对象测试一下：
//新建一个类Car的对象。
var xiali = new Car("xiali", "aaa", 15);
alert(xiali.engine);
xiali.showme();
以上，是prototype的基本应用，但是也是prototype的最主要的应用。
掌握的prototype的使用，在以后的过程中，对于对象的构建和继承，会有更深层次的理解。
上一篇：微信小程序 倒计时组件实现代码
栏 目：JavaScript代码
下一篇：javascript 中关于array的常用方法详解
本文标题：Javascript中prototype的使用详解
本文地址：http://www.codeinn.net/misctech/34251.html
