types - 如何在 TypeScript 中注释递归类型？

Question

如果我有这样的功能：

function say(message: string) {
    alert(message);
    return say;
}

它有一个有趣的属性，我可以将调用链接到它：

say("Hello,")("how")("are")("you?");

如果我将数字传递给第一次调用，编译器将生成警告，但它允许我将数字放入后续调用中。

say("Hello")(1)(2)(3)(4)

当我将无效类型传递给链式调用时，我需要向say函数添加什么类型注释以使编译器生成警告？

Answer 1

引用自身的类型必须有名称。例如，

interface OmegaString {
    (message: string): OmegaString;
}

然后您可以注释say为OmegaString,

function say(message: string): OmegaString {
    alert(message);
    return say;
}

那么下面的代码将进行类型检查。

say("Hello,")("how")("are")("you?");

但以下不会，

say("Hello")(1)(2)(3)(4)

Answer 2

可链接的方法

当您使用类而不是函数时，您可以使用this类型来表示方法返回调用它的实例的事实（链接方法）。

没有this：

class StatusLogger {
    log(message: string): StatusLogger { ... }
}
// this works
new ErrorLogger().log('oh no!').log('something broke!').log(':-(');

class PrettyLogger extends StatusLogger {
    color(color: string): PrettyLogger { ... }
}
// this works
new PrettyLogger().color('green').log('status: ').log('ok');
// this does not!
new PrettyLogger().log('status: ').color('red').log('failed');

与this：

class StatusLogger {
    log(message: string): this { ... }
}
class PrettyLogger extends StatusLogger {
    color(color: string): this { ... }
}
// this works now!
new PrettyLogger().log('status:').color('green').log('works').log('yay');

可链接功能

当函数可链接时，您可以使用接口键入它：

function say(text: string): ChainableType { ... }
interface ChainableType {
    (text: string): ChainableType;
}
say('Hello')('World');

具有属性/方法的可链接函数

如果函数具有其他属性或方法（例如jQuery(str)vs jQuery.data(el)），您可以将函数本身键入为接口：

interface SayWithVolume {
    (message: string): this;
    loud(): this;
    quiet(): this;
}

const say: SayWithVolume = ((message: string) => { ... }) as SayWithVolume;
say.loud = () => { ... };
say.quiet = () => { ... };

say('hello').quiet()('can you hear me?').loud()('hello from the other side');