今日再讲下js里的继承

今天再讲下js里的继承

js的继承说简单也很简单,请看:

 

function SuperClass(){
...
}

SuperClass.prototype.xxx = function(){...}
...

function SubClass(){
...
}

SubClass.prototype = new SuperClass();

 看着是不是很简单?不过问题来了。

 

//这句似乎改变了SubClass的constructor噢
SubClass.prototype = new SuperClass();

 怎么办?再加一句打个补丁哈。。

SubClass.prototype = new SuperClass();
SubClass.prototype.constructor = SubClass;

 这样看着好像完美都啦 :)

请慢!!!

//这里好像同样也覆盖了SubClass原来的原型函数噢,肿么办???
SubClass.prototype = new SuperClass();

 对了!先保存原来的原型函数,后面再恢复回来!具体的实现我就不写咯。。

到这里一切该结束了吧!!哼!一个继承用得着这么复杂么?

 

等等,大哥,这事还没完呢!

/**
 * 还是这一句!怎么又是你啊,麻烦真够多的:(
 * 这一句有一个隐藏的问题?想到了没。
 * SuperClass的构造器里也许有着很复杂的逻辑呢。比如:
 * 1.执行了一个超长时间的阻塞操作
 * 2.加载了大量的数据
 * 问题来了:CPU被白白的浪费了,内存也被白白的占用了
 * 我只是想继承你的原型方法而已嘛,你不用为我做这么多的实例化操作的...
 */
SubClass.prototype = new SuperClass();

 这可肿么办哈。。。

ecmascript5 提供了一个Object.create的方法,用在这里挺不错的,怎么做呢?

SubClass.prototype = Object.create(SuperClass.prototype);

 可是IE8好像还不支持耶。别急,那就这样来呗:

var F = new Function();
F.prototype = SuperClass.prototype;
...
SubClass.prototype = new F();//这下终于没有多余的实例化操作啦
...

 

然后把上面的点都连在一起就可以有一个不错的继承方法啦。。