JS面向对象编程详解(2)

  高三中只给出了单继承的解决方案,关于多继承的模拟我们还得自己想办法。由于多继承有其本身的困难:面向对象语言如果支持了多继承的话,都会遇到著名的菱形问题(Diamond Problem)。假设存在一个如左图所示的继承关系,O中有一个方法foo,被A类和B类覆写,但是没有被C类覆写。那么C在调用foo方法的时候,究竟是调用A中的foo,还是调用B中的foo?

JS面向对象编程详解

  所以大多数语言并不支持多继承,如Java支持单继承+接口的形式。JavaScript并不支持接口,要在一个不支持接口的语言上去模拟接口怎么办?答案是著名的鸭式辨型。放到实际代码中就是混入(mixin)。原理很简单:

function mixin(t, s) { for (var p in s) { t[p] = s[p]; } }

  值得一提的是dojo利用MRO(方法解析顺序(Method Resolution Order),即查找被调用的方法所在类时的搜索顺序)方式解决了多继承的问题。  

  到此,我们已经清楚了模拟类语言的基本原理。作为一个爱折腾的程序员,我希望拥有自己的方式来简化类的创建:

提供一种便利的方式去创建类,而不暴露函数的prototype属性

在子类中覆盖父类方法时,能够像Java一样提供super函数,来直接访问父类同名方法

以更方便的方式添加静态变量和方法而不去关心prototype

像C#那样支持Attribute   

最终,在借鉴各位大牛的知识总结,我编写了自己的类创建工具O.js:

(function(global) { var define = global.define; if (define && define.amd) { define([], function(){ return O; }); } else { global.O = O; } function O(){}; O.derive = function(sub) { debugger; var parent = this; sub = sub ? sub : {}; var o = create(parent); var ctor = sub.constructor || function(){};//如何调用父类的构造函数? var statics = sub.statics || {}; var ms = sub.mixins || []; var attrs = sub.attributes || {}; delete sub.constructor; delete sub.mixins; delete sub.statics; delete sub.attributes; //处理继承关系 ctor.prototype = o; ctor.prototype.constructor = ctor; ctor.superClass = parent; //利用DefineProperties方法处理Attributes //for (var p in attrs) { Object.defineProperties(ctor.prototype, attrs); //} //静态属性 mixin(ctor, statics); //混入其他属性和方法,注意这里的属性是所有实例对象都能够访问并且修改的 mixin(ctor.prototype, sub); //以mixin的方式模拟多继承 for (var i = 0, len = ms.length; i < len; i++) { mixin(ctor.prototype, ms[i] || {}); } ctor.derive = parent.derive; //_super函数 ctor.prototype._super = function(f) { debugger; return parent.prototype[f].apply(this, Array.prototype.slice.call(arguments, 1)); } return ctor; } function create(clazz) { var F = function(){}; F.prototype = clazz.prototype; //F.prototype.constructor = F; //不需要 return new F(); }; function mixin(t, s) { for (var p in s) { t[p] = s[p]; } } })(window);

类创建方式如下:

var Person = O.derive({ constructor: function(name) {//构造函数 this.setInfo(name); }, statics: {//静态变量 declaredClass: "Person" }, attributes: {//模拟C#中的属性 Name: { set: function(n) { this.name = n; console.log(this.name); }, get: function() { return this.name + "Attribute"; } } }, share: "asdsaf",//变量位于原型对象上,对所有对象共享 setInfo: function(name) {//方法 this.name = name; } }); var p = new Person('lzz'); console.log(p.Name);//lzzAttribute console.log(Person);

继承:

var Employee = Person.derive({//子类有父类派生 constructor: function(name, age) { this.setInfo(name, age); }, statics: { declaredClass: "Employee" }, setInfo: function(name, age) { this._super('setInfo', name);//调用父类同名方法 this.age = age; } }); var e = new Employee('lll', 25); console.log(e.Name);//lllAttribute console.log(Employee);

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgyxzf.html