當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript实现面向对象的继承
生活随笔
收集整理的這篇文章主要介紹了
javascript实现面向对象的继承
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
作者:Yan
Douglas Crockford 的方案:
//Crockford's approach adds the 'inherits' method //to all functions, as well as a per-class method //called 'uber' that allows you to make super calls. Function.prototype.inherits = function(parent) {var d = 0, p = (this.prototype = new parent());this.prototype.uber = function(name) {var f, r, t = d, v = parent.prototype;if (t) {while (t) {v = v.constructor.prototype;t -= 1;}f = v[name];} else {f = p[name];if (f == this[name]) {f = v[name];}}d += 1;r = f.apply(this, Array.prototype.slice.apply(arguments, [1]));d -= 1;return r;}; }; function BaseClass() { } BaseClass.prototype.getName = function() {return "BaseClass(" + this.getId() + ")"; }BaseClass.prototype.getId = function() {return 1; }function SubClass() {} SubClass.inherits(BaseClass); SubClass.prototype.getName = function() {//Looks pretty clean and it calls//the getName() method of BaseClassreturn "SubClass(" + this.getId() + ") extends " +this.uber("getName"); }SubClass.prototype.getId = function() {return 2; }function TopClass() {} TopClass.inherits(SubClass); TopClass.prototype.getName = function() {//Looks pretty clean and it calls//the getName() method of SubClassreturn "TopClass(" + this.getId() + ") extends " +this.uber("getName"); }TopClass.prototype.getId = function() {//Ok, so this.getId() should always//return the result of calling getId()//on SubClass, which is 2. So does it?return this.uber("getId"); }//Alerts "TopClass(2) extends SubClass(1) extends BaseClass(1)" //Hmm... this.getId() didn't always return 2. //What happened? alert(new TopClass().getName());
Josh Gertzen 的方案,他指出了前面方案存在的問題,并給出他自己的方案:
//Defines the top level Class function Class() { } Class.prototype.construct = function() {}; Class.__asMethod__ = function(func, superClass) { return function() {var currentSuperClass = this.$;this.$ = superClass;var ret = func.apply(this, arguments); this.$ = currentSuperClass;return ret;}; };Class.extend = function(def) {var classDef = function() {if (arguments[0] !== Class) { this.construct.apply(this, arguments); }};var proto = new this(Class);var superClass = this.prototype;for (var n in def) {var item = def[n]; if (item instanceof Function) {item = Class.__asMethod__(item, superClass);}proto[n] = item;}proto.$ = superClass;classDef.prototype = proto;//Give this new class the same static extend method classDef.extend = this.extend; return classDef; };//Hey, this class definition approach //looks much cleaner than then others. var BaseClass = Class.extend({construct: function() { /* optional constructor method */ },getName: function() {return "BaseClass(" + this.getId() + ")";},getId: function() {return 1;} });var SubClass = BaseClass.extend({getName: function() {//Calls the getName() method of BaseClassreturn "SubClass(" + this.getId() + ") extends " +this.$.getName.call(this);},getId: function() {return 2;} });var TopClass = SubClass.extend({getName: function() {//Calls the getName() method of SubClassreturn "TopClass(" + this.getId() + ") extends " +this.$.getName.call(this);},getId: function() {//Much better, this.getId() always//returns the result of calling getId()//on SubClass, which is 2. return this.$.getId.call(this);} });//Alerts "TopClass(2) extends SubClass(2) extends BaseClass(2)" //Everything looks good! alert(new TopClass().getName());
創作挑戰賽新人創作獎勵來咯,堅持創作打卡瓜分現金大獎
總結
以上是生活随笔為你收集整理的javascript实现面向对象的继承的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: word如何替换行首?
- 下一篇: struts2中s:select标签在f