首页 > 关于新类继承父类的问题

关于新类继承父类的问题

有一个自己创建的新类 newClass, 还有一个需要继承的父类 supClass。
然后 newClass.prototype= new supClass();
新类就能继承父类的所有方法和成员变量了。为什么?
以前写过

(function($){
    var newClass=function(){
    this.a="aaaa";
    this.b="bbbb";
    //一些成员变量
    this.count();
    //执行自己定义的函数
    }
    newclass.prototype={
        cout:function(){
        return this.a+this.b;
        }
    }
   window[newClass]=newClass;
})(jQuery);

是不是newClass.prototype= new supClass();让新类的原型作为父类的this获得所有方法以及变量?


new操作符具体做了什么?

1、创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型。
2、属性和方法被加入到 this 引用的对象中。
3、新创建的对象由 this 所引用,并且最后隐式的返回 this 。

代码表示

//var obj = new Base();
var obj  = {};
obj.__proto__ = Base.prototype;
Base.call(obj);

newClass.prototype = new supClass()和上面等同


这里面涉及3个知识点:

  1. 原型和原型链
    大概讲的就是JavaScript中每个对象都会有一个原型,自己本身找不到的属性会到原型中找,对象与对象之间可以发生关系,对象与原型之间同样可以发生关系~~~
    《Javascript高级程序设计 3版》已经讲得很透彻了,看不懂猛戳下面链接:
    汤姆大叔深入理解JavaScript系列5 - 强大的原型和原型链:
    http://www.cnblogs.com/TomXu/archive/2012/01/05/2305453.html

  2. JavaScript设计模式之原型模式
    原型模式,是指用原型实例指向创建对象的种类,并且通过拷贝这些原型创建新的对象,看不懂猛戳下面链接:
    汤姆大叔深入理解JavaScript系列42-设计模式之原型模式:
    http://www.cnblogs.com/TomXu/archive/2012/04/16/2436460.html
    言而总之就是把对象A作为对象B的原型,B就可以使用A的属性和方法了。
    我看过后有总结:http://my.oschina.net/Karon/blog/499328

  3. this
    是不是newClass.prototype= new supClass();让新类的原型作为父类的this获得所有方法以及变量?
    这里的this指的是调用者,就是new出来的那个(new newClass()),跟父类的this没什么关系。不然怎么实现代码:this.a+this.b,‘new supClass()’里面又没有这两个属性。

顺便说下,代码要规范:

  1. 这段代码里面有两处没写‘;’,分别是变量newClass的结尾处和newclass.prototype的结尾;

  2. newclass.prototype的newclass应该是newClass(不然就报错了~)。


能看到这段代码吗?
newclass.prototype就是一个对象啊,

newclass.prototype={
    cout:function(){
    return this.a+this.b;
    }
}

而对象可以通过字面量的方式创建,如上代码所示
还可以通过new操作符的方式,例如
newClass.prototype= new supClass();

现在newClass的实例对象的原型为new supClass()产生的对象,也就是newclass.prototype
new supClass()产生的对象的原型为supClass.prototype


js 里的继承实现直接确实有点麻烦,所以现在我都懒得写继承,直接用 TypeScript 翻译出来就好了

传送门 TypeScript 在线翻译

class SuperClass {
}
class SubClass extends SuperClass {
    
}

翻译出来

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
};
var SuperClass = (function () {
    function SuperClass() {
    }
    return SuperClass;
})();
var SubClass = (function (_super) {
    __extends(SubClass, _super);
    function SubClass() {
        _super.apply(this, arguments);
    }
    return SubClass;
})(SuperClass);

Javascript中的继承是通过原型链来完成的。
当一个构造函数(楼主指的是类)建成后,会默认有个prototype属性,这个属性是个指针,指向一个对象,这个对象就是构造函数的原型对象,我们可以在这个原型对象上扩充属性和方法,让new出来的实例可以共享这些属性和方法。

  1. new supClass()这个操作后,会在堆空间中开辟一快空间,返回一个实例的栈地址

  2. newClass.prototype= new supClass(),让后把这个实例的地址赋给prototype属性

  3. 这样通过new newClass()出来的实例便会共享new supClass中的实例和方法,达到继承的作用。

详细参考《Javascript高级程序设计(第三版)》6.2.3节-原型模式。

【热门文章】
【热门文章】