在Typescript中为`this`关键字键入注释

时间:2017-07-21 16:03:24

标签: javascript typescript

我有一个独立的功能,意味着使用Function.prototype.call提供的上下文。

例如:

function foo () {
    return this.bar;
}

> foo.call({bar: "baz"})
baz

在这种情况下,有没有办法为this关键字提供Typescript类型注释?

1 个答案:

答案 0 :(得分:5)

在我看来,它有点难看。

首先,您可以使用特殊的this parameter语法来确定您期望this的对象类型:

function foo (this: {bar: string}) {
    return this.bar; // no more error
}

如果直接调用它会有所帮助:

foo(); // error, this is undefined, not {bar: string}

var barHaver = { bar: "hello", doFoo: foo };
barHaver.doFoo(); // acceptable, since barHaver.bar is a string

var carHaver = { car: "hello", doFoo: foo };
carHaver.doFoo(); // unacceptable, carHaver.bar is undefined

但您想使用foo.call()。不幸的是,TypeScript中的Function.prototype.call()输入不会真正为您强制执行此限制:

foo.call({ bar: "baz" }); // okay, but
foo.call({ baz: "quux" }); // no error, too bad!

将更好的内容合并到TypeScript&#39; Function声明中会导致我出现问题,(丑陋的第一点;您需要将foo转换为某些内容),以便您可以尝试这样的事情:< / p>

interface ThisFunction<T extends {} = {}, R extends any = any, A extends any = any> {
  (this: T, ...args: A[]): R;
  call(thisArg: T, ...args: A[]): R;
}

ThisFunction<T,R,A>this类型为T的函数,返回值类型为R,休息参数类型为A[]。 (第二点丑陋:你不能以类型系统强制执行的方式轻松指定不同类型的多个参数。)

然后你可以将foo投射到ThisFunction<{ bar: string }, string>,(第三点丑陋:类型系统不会推断出this类型),然后最终使用call():< / p>

(<ThisFunction<{ bar: string }, string>>foo).call({ bar: "baz" }); // okay, and
(<ThisFunction<{ bar: string }, string>>foo).call({ baz: "quux" }); // error, hooray!

希望有所帮助!