Typescript为简单的类继承生成javascript代码

Question

我有一个关于Typescript如何为简单的类继承生成javascript代码的问题.下面是一些Typescript代码,后跟生成的javascript代码.

打字稿代码:

class Animal {
    constructor(public name: string) { }
    move(meters: number) {
        alert(this.name + " moved " + meters + "m.");
    }
}

class Cat extends Animal {
    constructor(name: string) { super(name); }
    move() {
        alert("run...");
        super.move(5);
    }
}

生成的Javascript代码:

var __extends = 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 Animal = (function () {
    function Animal(name) {
        this.name = name;
    }
    Animal.prototype.move = function (meters) {
        alert(this.name + " moved " + meters + "m.");
    };
    return Animal;
})();

var Cat = (function (_super) {
    __extends(Cat, _super);
    function Cat(name) {
        _super.call(this, name);
    }
    Cat.prototype.move = function () {
        alert("run...");
        _super.prototype.move.call(this, 5);
    };
    return Cat;
})(Animal);

您将看到生成的javascript代码包含__extends(d, b).此函数将所有基类属性复制到派生类:d[p] = b[p];.

我的问题是为什么需要这种复制,只需设置就Cat.prototype = _super;可以了,并且内联基于Javascript原型的继承.将基本ctor属性复制到派生的ctor就d[p] = b[p];好像是内存的浪费.

Answer 1

原型上不存在静态属性/函数.在prototype一个时才使用new被创建的实例.

因此,第一个循环只是复制静态属性(包括函数).它不会复制任何内容prototype(因为for(var v in p)不包括prototype原型上声明的或属性/函数).

prototype在JavaScript中保留链的最佳方法是prototype将子类设置为超类的实例.在上面的例子中,它意味着相当于:

Cat.prototype = new Animal();

这样,当JavaScript正在寻找匹配属性时,它将通过继承层次结构正确地遵循原型链.

如果直接设置:

Cat.prototype = Animal.prototype

这意味着任何运行时更改Cat prototype都会影响Animal它们指向同一个实例(通常不需要).