javascript - TypeScript 和无服务器 : `this` Undefined When Calling Private Methods from Public Methods

Question

我正在尝试在 TypeScript 中构建 AWS Serverless( https://serverless.com/ ) 函数。

具体来说，我使用一个调用一些私有(private)方法的公共(public)方法来定义一个抽象类。

这是我的简化 TypeScript 类:

export abstract class AbstractPayloadProcessor {

    private preHandlePayload(payload) {
        console.log('arrived in prehandle method')
    }

    private postHandlePayload(payload) {
        console.log('arrived in posthandle method')
    }

    protected handleException(error) {
        console.log('Exception has occurred:', error)
    }

    public processPayload(event) {

        // this is the problematic line
        this.preHandlePayload(event.payload)
        .
        .
        .
    }
}

我使用 webpack 将其转译为 ES5，它生成以下 JavaScript:

var AbstractPayloadProcessor = /** @class */ (function () {
    AbstractPayloadProcessor.prototype.preHandlePayload = function (payload) {
        console.log('arrived in prehandle method');
    };
    AbstractPayloadProcessor.prototype.postHandlePayload = function (payload) {
        console.log('arrived in posthandle method');
    };
    AbstractPayloadProcessor.prototype.handleException = function (error) {
        console.log('Exception has occurred:', error);
    };
    AbstractPayloadProcessor.prototype.processPayload = function (event) {
        // this line throws the exception
        this.preHandlePayload(event.payload);
        .
        .
        .
}());

确切的异常(exception)是:

TypeError: Cannot read property 'preHandlePayload' of undefined

到目前为止，我已经尝试将 webpack 配置设置为使用 ES6，并尝试使用箭头函数来声明 typescript 中的函数。两者都会产生相同的异常。

processPayload 函数正在 Serverless 框架内的某个地方被调用，但我不知道实现细节。如果有人有该框架的经验并能对此有所了解，我将不胜感激。

感谢您的阅读。

Answer 1

疯狂猜测

我猜你正在做的是使用 someObject.processPayload 并将其作为回调传递给某个函数，或者将其保存在某个地方作为事件处理程序。该函数依次调用 this.preHandlePayload() 但它不能，因为没有正确调用它的 this 未定义。

更多信息

很少有可能导致 this 在方法内部未定义，并且它是私有(private)的还是公共(public)的并不重要 - 因为正如您所看到的，它们最终都会被转译后公开。

一种可能的方法是在 method1 中，如果您调用 method2() 而不是 this.method2() 那么您将得到 this 在 method2 中未定义。

另一个常见错误是将方法保存为事件处理程序或将其用作回调，例如:

x.onSomething = object.method;

或

functionThatTakesCallback(object.method);

要使这些情况起作用，您需要传递一个匿名函数，例如:

x.onSomething = (...args) => object.method(...args);

或将方法绑定(bind)到该对象:

x.onSomething = object.method.bind(object);

当然，很难说出您的情况真正的问题是什么，因为您没有告诉我们您实际上如何调用您的方法，而这是调用不是方法的定义，通常将undefined放入this中。