JavaScript Prototype.js 类的定义方式与 constructor 修复

Prototype.js 类的定义与 constructor 修复

6、Prototype.js 的写类方式

// 这是 Prototype.js 库中的核心代码片段
var Class = {
create: function() {
return function() {
this.initialize.apply(this, arguments);
} 
} 
} 
// 简化后的逻辑示意
function Clazz() {
return function(){
this.initialize.apply(this,arguments);
} 
} 

按照以下步骤定义一个类：

// 定义类名 Person
var Person = Class.create();
// 通过覆盖原型对象来定义 Person 的属性和方法
Person.prototype = {
initialize : function(name) {
this.name = name;
}, 
getName : function() {
return this.name;
}, 
setName : function(name) {
this.name = name;
} 
} 
// 创建实例对象
var p = new Person("jack");
console.log(p.constructor == Person);// 输出结果为 false

initialize 方法负责对象的初始化工作，类似于传统构造函数，其他方法按顺序定义在原型中即可。

这里存在一个问题，通过执行 p.constructor == Person 返回 false 可以看出，这是 Prototype.js 的一个小缺陷。原因是直接重写了 Person 的原型对象，导致 constructor 属性丢失或指向错误。为了使 constructor 能正确指向构造器，只需在重写原型时手动维护 constructor 属性即可。

Person.prototype = {
constructor : Person,// 注意这里需要显式指定
initialize : function(name) {
this.name = name;
}, 
getName : function() {
return this.name;
}, 
setName : function(name) {
this.name = name;
} 
}

完成上述修改后，再次执行 p.constructor == Person 将返回 true。