javascript - 在 TypeScript 中使用箭头函数 : how to make them class methods?

Question

我的编程经验相当丰富，但对 TypeScript 还很陌生。

尝试将它与 jQuery 一起使用并立即遇到回调的“this”问题(例如 $(document).ready。

使用 $.proxy() 是一种方法，但使用 TypeScript 的箭头 (lambda) 函数似乎要好得多。但我只看到它们用作表达式——也就是说，整个函数都是内联定义的。我希望能够设置可以作为我的类的方法调用的箭头函数，例如(伪代码):

class Something {
    constructor() {
    $(' nav li').click(this.menuClick);
    }
 private menuClick (and this would be an arrow function to preserve 'this')()=>    
  // it would call this.anotherMethod()
  // plus lots of other things so it won't easily fit inline

 private anotherMethod():void {
        // do something on the menu click, several lines perhaps, 
  }

}

我来自 AS3 的 OOP 背景，这就是我能够做到的 - “this”很容易访问，或者很清楚如何访问它。我热衷于使用 TypeScript 来克服我在使用 Javascript 时遇到的 OOP 障碍——但是(对我来说)必须代理所有 jQuery 调用似乎很麻烦(我知道有一些类可以做到这一点我，但是有没有更简单的方法，使用箭头/lambda 函数？)。

如果我没有摸索出显而易见的东西，请耐心等待，但这对我来说并不明显!

Answer 1

默认情况下没有办法执行此操作的原因是，如果自动完成，就每个实例的内存消耗而言，这是一个巨大的运行时成本。与其拥有一个包含所有函数的基本原型(prototype)对象，并且每个类实例都指向该原型(prototype)的函数定义，不如为该类的每个实例最终为每个函数创建一个闭包。 p>

future 可能会有更好的类型系统支持，但就目前而言，处理 this 绑定(bind)问题只是编写任何风格的 JavaScript 时必须支付的税。希望随着 TypeScript 之类的东西获得发展势头，库作者将减少对 this 的使用(尽管 DOM 永远不会有这种奢侈)。

好处是在 TypeScript 中，当您确实需要重新绑定(bind) this 时，代码量不会增加很多:

$('nav li').click(() => this.menuClick());

或

$('nav li').click(this.menuClick.bind(this));