在TypeScript函数中声明'this'的类型？

Question

我正在使用TypeScript编写一个 grunt任务 ，并尝试将JavaScript中已有的内容翻译过来。

因此，当grunt运行一个任务时，它会运行一个函数。在运行时，grunt会将this设置为一个具有有用属性的对象，就像jQuery会重载this以便你可以操作元素一样。我可以访问类似于this.files这样的有用属性；

grunt.registerMultiTask('clean', function() {
    this.files.forEach(function(f) { Delete(f); });
});

因此，“删除this.files中的所有文件”。

然而，在TypeScript中，我不知道是否可以“提示”编译器this是特定类型，因此我无法获得智能感知。如何告诉TypeScript将this视为不同类型？

- Steve Cooper

Answer 1

从TS 2.0开始，您可以使用fake this参数来指定函数的this类型（应该是第一个参数）：

grunt.registerMultiTask('clean', function(this: SomeType) {
    //...
});

this参数是在函数参数列表中首先出现的假参数。

更多信息请参见此处

- Aleksey L.

---

这是关于虚假 this 参数的相关文档。 - Robert K. Bell

“这个”虚假参数是一个非常难以通过谷歌搜索的东西！ - Simon_Weaver

看到这个（请原谅双关语），觉得这纯粹是巫术 =） - Olga

Answer 2

我该如何告诉 TypeScript 将这个视为不同的类型？

您可以通过声明一个 this 参数来完成。对于您的用例，我已添加了 this: {files:any[]}：

grunt.registerMultiTask('clean', function(this: {files:any[]}) {
    this.files.forEach(function(f) { Delete(f); });
});

更多

• 官方文档关于this参数的说明

- basarat

Answer 3

我发现现在可以通过以下方式实现：

class ClassyClass {
    prop = 'Juicy Strings'
}

function x( this: ClassyClass ) {
    console.log( this.prop )
}

我更倾向于一种替代方案，它不会占用参数行中的实际空间

function x() {
    const that: ClassyClass = this

    console.log( that.prop )
}

- Jason

---

或者你可以使用多行函数参数 ;) - Matthias

使用 that 对我来说也感觉最干净。谢谢 @Jason。回顾过去，我记得在 jQuery 时代经常使用 that = this;。 - Sir.Nathan Stassen

如果你将它放在参数中，这样在调用函数时不就添加了类型检查吗？这会是一种更严格的解决方案，是吗？ - SanBen

Answer 4

我有一点答案。我可以这样做：

var self = <grunt.task.IMultiTask<string>>this;
self.files.forEach(function (f) {

});

这个可以正常工作。但会有一些后果，比如不能编写箭头函数...

- Steve Cooper

---

你仍然可以编写箭头函数，因为它们将闭合self变量。箭头函数中的this仍然会被错误地类型化，但至少你可以节省一些字符！ - Yourpalal