Javascript 如何使用原型更新fat arrow函数？

是否有一种方法可以使用

原型

更新fat arrow函数

class Greeter {
    greeting: string;
    constructor(message: string) {
        this.greeting = message;
    }
    greet = () => {
        alert("Hello, " + this.greeting + " inside");
    }
}

Greeter.prototype.greet = () => {
    alert("Hello, " + this.greeting + " outside");
}

let greeter = new Greeter("world");
greeter.greet();
// It should alert Hello world outside
// But it is showing  Hello world inside

我是否错误地理解了胖箭头语法，并且它不能像这样更新，任何参考都会有帮助

---

提前谢谢

创建迎宾对象时。它规定：

this.greet = function () {
  alert("Hello, " + _this.greeting + "inside");
};

因此，它将覆盖您在原型中设置的内容。如果您不编写相同的greet（）函数，那么它将调用您在prototype中设置的内容

另一件要记住的事情是，当您使用箭头功能时：

Greeter.prototype.greet = () => {
  alert("Hello, " + this.greeting + " outside");
}

---

这是。

这里不是对象本身，但它属于外部上下文，这意味着您无法正确获取此。问候语。

当您创建问候者对象时。它规定：

this.greet = function () {
  alert("Hello, " + _this.greeting + "inside");
};

因此，它将覆盖您在原型中设置的内容。如果您不编写相同的greet（）函数，那么它将调用您在prototype中设置的内容

另一件要记住的事情是，当您使用箭头功能时：

Greeter.prototype.greet = () => {
  alert("Hello, " + this.greeting + " outside");
}

---

这是。

这里不是对象本身，但它属于外部上下文，这意味着您无法正确地获取此。问候语。

要更好地了解发生了什么，您应该查看编译后的js代码：

var _this = this;
var Greeter = (function () {
    function Greeter(message) {
        var _this = this;
        this.greet = function () {
            alert("Hello, " + _this.greeting + " inside");
        };
        this.greeting = message;
    }
    return Greeter;
}());
Greeter.prototype.greet = function () {
    alert("Hello, " + _this.greeting + " outside");
};

有一个

greet

函数添加到原型中，但是当您创建

greet

的新实例时，该方法将在构造函数中被重写

通常最好使用普通类方法：

class Greeter {
    // ...
    greet() {
        alert("Hello, " + this.greeting + " inside");
    }
}

然后编译成js，原型上已经有

警报

：

var Greeter = (function () {
    function Greeter() {
    }
    Greeter.prototype.greet = function () {
        alert("Hello, " + this.greeting + " inside");
    };
    return Greeter;
}());

如果在执行

greet

时担心失去

此

的作用域（因为您将其作为回调或类似的方式传递），则很容易：

setTimeout(greeter.greet.bind(greeter), 1000);

或

---

编辑 如果你想做这样的事情：

class Greeter {
    greeting: string;
    message: string = "";
    constructor(message: string) {
        this.greeting = message;
    }
    greet(){
      return "Hello, " + this.greeting + " inside";
    }
}

let oldGreet = Greeter.prototype.greet;
Greeter.prototype.greet = function(){
   return oldGreet() + " appended outside";
}

它无法正常工作，因为它将打印：

您好，未定义的内部附加外部

这是因为

这个
不是
问候者的实例，它应该是
oldGreet.call（this）
：

（）
为了更好地理解发生了什么，您应该查看编译后的js代码：

var _this = this;
var Greeter = (function () {
    function Greeter(message) {
        var _this = this;
        this.greet = function () {
            alert("Hello, " + _this.greeting + " inside");
        };
        this.greeting = message;
    }
    return Greeter;
}());
Greeter.prototype.greet = function () {
    alert("Hello, " + _this.greeting + " outside");
};

有一个
greet
函数添加到原型中，但是当您创建
greet
的新实例时，该方法将在构造函数中被重写

通常最好使用普通类方法：

class Greeter {
    // ...
    greet() {
        alert("Hello, " + this.greeting + " inside");
    }
}

然后编译成js，原型上已经有
警报
：

var Greeter = (function () {
    function Greeter() {
    }
    Greeter.prototype.greet = function () {
        alert("Hello, " + this.greeting + " inside");
    };
    return Greeter;
}());

如果在执行
greet
时担心失去
此
的作用域（因为您将其作为回调或类似的方式传递），则很容易：

setTimeout(greeter.greet.bind(greeter), 1000);

或


编辑
如果你想做这样的事情：

class Greeter {
    greeting: string;
    message: string = "";
    constructor(message: string) {
        this.greeting = message;
    }
    greet(){
      return "Hello, " + this.greeting + " inside";
    }
}

let oldGreet = Greeter.prototype.greet;
Greeter.prototype.greet = function(){
   return oldGreet() + " appended outside";
}

它无法正常工作，因为它将打印：

您好，未定义的内部附加外部

这是因为
这个
不是
问候者的实例，它应该是
oldGreet.call（this）
：

（）
感谢您的澄清，我理解它为什么不起作用，但是我仍然对
这个
绑定有问题，它给了我一个未定义的问题。您能用使用
绑定的代码更新您的问题吗？我已经创建了一个相同的，请看一看。您不能这样做，首先，您的
Greeter.prototype.greet=（）=>{…}
重写
greet
方法，而不调用前面的定义。其次，编译器不理解第二个
问候语中的
这个
是什么，这就是为什么它不适合您的原因。你能给我解释一下你想用这个达到什么目的吗？为什么您需要第二个
greet
函数？我已经用实际场景更新了，我正在尝试更新greet方法，以便它可以使用类中最新的函数或通过原型附加的最新函数，并使用新功能进行增强。感谢您的澄清，我理解它为什么不起作用，但是我仍然对
这个
绑定有问题，它给了我一个未定义的问题。你能用使用
bind
并且未定义的代码更新你的问题吗？我已经为同样的问题创建了一个，请看一看。你不能这样做，首先你的
Greeter.prototype.greet=（）=>{…}
重写
greet
方法，而不调用前面的定义。其次，编译器不理解第二个
问候语中的
这个
是什么，这就是为什么它不适合您的原因。你能给我解释一下你想用这个达到什么目的吗？为什么需要第二个
greet
函数？我已经用实际场景更新了，我正在尝试更新greet方法，以便它可以采用类中最新的函数或通过原型附加的最新函数，并用新功能增强。