在 javascript 中扩展答案

【问题标题】：Extends in javascript在 javascript 中扩展
【发布时间】：2021-10-07 20:08:40
【问题描述】：

有人可以帮我理解这段代码吗？对我来说似乎太复杂了。

var __extends = this.__extends || function (d, b) {
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
};


var PageView = (function (_super) {
    "use strict";

    __extends(MyPageView, _super);

 function MyPageView(rootElement, viewModelParameter, calendarWeeksViewModel) {
});


}

【问题讨论】：

与Typescript and Google Closure 重复，但这个问题足以解释他们从何处获得代码。进一步讨论here。您可以阅读 javascript 原型继承以了解更多信息。
他们从 tsc 命令生成的 Typescript 中的 extends 关键字中获取代码，然后进行未混淆处理。当工作仍在继续尝试理解生成的代码并最终清理它并对问题做出很好的回答时，我不认为它是重复的。另一个问题是关于别的事情。

标签： javascript

【解决方案1】：

基本上是这样

__extends(MyPageView, _super);

从面向对象语言中的继承来考虑。一个类正在扩展一个超类或一个基类..

所以基本上这里MyPageView会扩展超类的功能和实现。

假设基础视图有method A() and method B()，当前视图有方法C()，那么你当前的视图可以访问它的视图中的所有三个方法A() , B() and C()。

但是假设 MyPageView 有 method B() ，在其中定义，那么视图内的方法将采用 precedence over the Method B() of Super View

var __extends = this.__extends || function (d, b) {
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
};

每个函数都有一个神奇的原型属性。

 var __extends = this.__extends || function (d, b) {

检查该函数是否在该上下文中可用，如果没有定义一个函数，它接受 2 个参数，要扩展的对象和扩展它的对象..

function __() { this.constructor = d; }

定义一个名为 __ 的新函数，其中上下文的 constructor 属性绑定到 object d

 __.prototype = b.prototype;

Object __ 的原型属性指向b.prototype 链..

 d.prototype = new __();

Super View的方法的访问发生在这里，你在这里设置对象的原型属性..

所以当新实例创建时，如果方法不可用，那么由于对象上的prototype，它会检查Super view中的方法，因为它在函数__上可用绑定到object d

【讨论】：

非常感谢！！但我不明白 this.constructor = d; 是什么__.prototype = b.prototype; d.prototype = new __();

【解决方案2】：

我也对这段代码感到困惑。
所以我在 chrome 中试试这个，看看控制台显示了什么。
没有“this.constructor = d;”构造函数是 Vector2
用“this.constructor = d;”构造函数是 Vector3

var __extends = this.__extends || function (d, b) {
    function __() {
        // mark this and try again
        this.constructor = d;
    }
    __.prototype = b.prototype;
    d.prototype = new __();
};

function Vector2(x, y) {
    this.x = x;
    this.y = y;

}

Vector2.prototype.length2 = function () {
    return Math.sqrt(this.x * this.x + this.y * this.y);
}

__extends(Vector3, Vector2)
function Vector3(x, y, z) {
    Vector2.call(this, x, y);
    this.z = z;
}

Vector3.prototype.length3 = function () {
    return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
}

var v2 = new Vector2(1, 1);
var v3 = new Vector3(1, 2, 3);
console.log(v3.constructor.prototype);

你可以和这个比较
终于知道为什么原来的代码会这样了

var __extends = this.__extends || function (d, b) {

    d.prototype = b.prototype;
};

我认为原来的代码相当于...

var __extends = this.__extends || function (d, b) {
    // function __() {
    //     // mark this and try again
    //     console.log(this);
    //     this.constructor = d;
    // }
    // __.prototype = b.prototype;
    // d.prototype = new __();

    d.prototype.__proto__ = b.prototype;
};

【讨论】：