3 
document.getElementById("someElement").addEventListener('click', function (event) {
    this._output.innerHTML = this.add(
        parseInt(this._x.value),
        parseInt(this._y.value)
    ).toString();

如果您看一下上面的语句，您会发现它只是一些用于将事件侦听器附加到 DOM 的 HTML。下面是一些做同样事情的代码：

document.getElementById("someElement").addEventListener('click', (event) => {
    this._output.innerHTML = this.add(
        parseInt(this._x.value),
        parseInt(this._y.value)
    ).toString();
});

这是问题所在，在第一个代码示例中，TypeScript 没有给我任何错误，这意味着所有参数都addEventListener匹配。但是，当我使用第二个时，似乎出现了问题。打字稿说，“参数类型与参数不匹配”。

我能做些什么来解决这个问题。我正在使用带有 Webstorm 7.0 EAP 的 Typescript 0.9.1。

更新 1

因此，在查看 typescript 中的主声明文件后，我通过将代码更改为以下内容来解决我的初始问题：

document.getElementById("Add").addEventListener('click',(event):void => {
    this._output.innerHTML = this.add(
        parseInt(this._x.value),
        parseInt(this._y.value)
    ).toString();

如果你看一下，我只是添加了一个返回类型。现在，我有一个新问题：Typescript 抱怨这this._output是一个未解决的变量。这是我完整的 typeScript 类：

class Calculator {
    private _x:HTMLInputElement;
    private _y:HTMLInputElement;
    private _output:HTMLSpanElement;

    constructor (xID: string, yID: string, outputID: string) {
        this._x = <HTMLInputElement> document.getElementById(xID);
        this._y = <HTMLInputElement> document.getElementById(yID);
        this._output = <HTMLInputElement> document.getElementById(outputID);

        this.makeCalculator();
    }

    add (x: number, y: number) {
        return x + y;
    }

    subtract (x: number, y: number) {
        return x - y;
    }

    makeCalculator () {
        document.getElementById("Add").addEventListener('click',(event):void => {
            this._output.innerHTML = this.add(
                parseInt(this._x.value),
                parseInt(this._y.value)
            ).toString();
        });
        document.getElementById("Subtract").addEventListener('click', (event):void => {
            this._output.innerHTML = this.subtract(
                parseInt(this._x.value),
                parseInt(this._y.value)
            ).toString();
        });
    }
}

如您所见，我正在尝试用打字稿制作一个简单的计算器。

4

1 回答 1

2

当您想使用this（指类）的词法转义值以及 this 的上下文值时（例如，this在 jquery 回调内部，它指的是引发事件的元素等）。您不能使用胖箭头 / lambdas ()=>{}。您使用函数，并this自己存储类变量。

但是，在您的代码中，我看到您只想使用thiswhich 引用该类，因此 lambda()=>{}对于您的情况就足够了。您的代码编译良好：在线检查。

于 2013-08-21T05:16:23.347 回答