写在前面

在 2008 年的时候，John Resig 写了一 Class.js，使用的方式如下：

这种看上去很酷很方便的继承方式，居然有一个致命的缺陷。那就是：

当父类 A 有一个方法 a, 子类 B 也有一个方法 a 的时候，仅仅只有子类 B 中的方法 a 才能访问父类 A 中的方法 a，子类 B 中的其他方法从此就无法访问到父类 A 中的方法 a。虽然这种场景很少，但是不完美啊不完美！！ 所以就有了今天向 ES6 看齐的 Class.js。

ES6 class

先来看看 ES6 中的 class 继承：

Class 之间可以通过 extends 关键字，实现继承，这比 ES5 的通过修改原型链实现继承，要清晰和方便很多。

class ColorPoint extends Point {}

上面代码定义了一个 ColorPoint 类，该类通过 extends 关键字，继承了 Point 类的所有属性和方法。但是由于没有部署任何代码，所以这两个类完全一样，等于复制了一个 Point 类。下面，我们在 ColorPoint 内部加上代码。

上面代码中，constructor 方法和 toString 方法之中，都出现了 super 关键字，它指代父类的实例（即父类的 this 对象）。

上面来自 ruanyifeng 的 es6 入门：http://es6.ruanyifeng.com/#docs/class

Class.js

下面是向 ES6 靠齐的 Class.js

//所有类的基类 var Class = function () { }; //基类增加一个 extend 方法 Class.extend = function (prop) { var _super = this.prototype; //父类的实例赋给变量 prototype var prototype = new this(); //把要扩展的属性复制到 prototype 变量上 for (var name in prop) { //下面代码是让 ctor 里可以直接访问使用 this._super 访问父类构造函数，除了 ctor 的其他方法，this._super 都是访问父类的实例 prototype[name] = name == "ctor" && typeof prop[name] == "function" && typeof _super[name] == "function" ? (function (name, fn) { return function () { //备份一下 this._super var tmp = this._super; //替换成父类的同名 ctor 方法 this._super = _super[name]; //执行，此时 fn 中的 this 里面的 this._super 已经换成了_super[name], 即父类的同名方法 var ret = fn.apply(this, arguments); //把备份的还原回去 this._super = tmp; return ret; }; })(name, prop[name]) : prop[name]; } //假的构造函数 function Class() { //执行真正的 ctor 构造函数 this.ctor.apply(this, arguments); } //继承父类的静态属性 for (var key in this) { if (this.hasOwnProperty(key) && key != "extend") Class[key] = this[key]; } // 子类的原型指向父类的实例 Class.prototype = prototype; //这里一定要用 new this //不能 Class.prototype._super = prototype;（这里明显错误，prototype 这时已经被 copy 进去了新的属性）//或者 Class.prototype._super = _super;（这里会导致_super instanceof 不准确）Class.prototype._super = new this(); //覆盖父类的静态属性 if (prop.statics) { for (var name in prop.statics) { if (prop.statics.hasOwnProperty(name)) { Class[name] = prop.statics[name]; if (name == "ctor") { Class[name](); } } } } Class.prototype.constructor = Class; //原型可扩展 Class.extendPrototype = function (prop) { for (var name in prop) { prototype[name] = prop[name]; } }; //任何 Class.extend 的返回对象都将具备 extend 方法 Class.extend = arguments.callee; return Class; };

没有想说的，都在注释里...

测试

使用和 ES6 一样，除了构造函数 ctor 方法可以直接通过 this._super 方法去访问 parent.ctor,
其余的方法可通过 this._super. 方法名 (xxxx) 去访问父类方法, 如果自身没有定义父类同名的方法，也可以直接通过 this. 方法名去访问父类的方法。
欢迎使用，玩得愉快。