将javascript链式setter转换为typescript

Question

我一直在javascript中使用这个习惯用法来创建链式setter。

function bar() {
let p = 0;
function f() {
}
f.prop = function(d) {
return !arguments.length ? p : (p = d, f);
}
return f;
}

这使我可以简单地创建和设置为const b = bar().prop(2)，将b作为函数，并允许附加更多的链式语句。它可以通过使用b.prop()来获得属性，当然不能进一步链接。

我正试图将其转换为TypeScript，并找到了这个解决方案，尽管它正确地允许键入，但它似乎很模糊。

p.prop = (...args: [number?]) => !args.length ? p : (p = args[0]!, f);

当参数有多个类型时，这就变得更加模糊了。

p.prop = (...args: [(number | boolean)?]) => !args.length ? p : (p = args[0]!, f);

有什么惯用的打字方式来设置和获取吗？

Answer 1

因为prop函数只接受一个可能的参数，所以只需将d声明为可选，然后检查它是否存在，就可以使Typescript版本与Javascript更相似(更简单(。不需要rest语法或数组：

f.prop = function(d?: number) {
return d === undefined ? p : (p = d, f);
}

对于其他类型，只需将该类型添加到d参数中，由于它将被分配给p，因此也可以声明p:的类型

function bar() {
let p: number | boolean = 0;
function f() {
}
f.prop = function (d?: number | boolean) {
return d === undefined ? p : (p = d, f);
}
return f;
}
const b = bar().prop(2)

Answer 2

您可以声明一个函数接口，如：

interface Chainable {
(): void;
prop: (d: any) => Chainable
};
function bar(): Chainable {
... 
const fChainable = f;
return fChainable;

}