(我正在使用严格的空检查)
我有以下带有重载类型的箭头函数:
type INumberConverter = {
(value: number): number;
(value: null): null;
};
const decimalToPercent: INumberConverter = (value: number | null): number | null => {
if (!value) {
return null;
}
return value * 100;
};
据我从其他问题的理解(在对类方法使用粗箭头语法时可以使用 TypeScript 重载吗?)这应该是有效的。尽管如此,我还是收到以下错误:
TS2322: Type '(value: number | null) => number | null' is not assignable to type 'INumberConverter'. Type 'number | null' is not assignable to type 'number'. Type 'null' is not assignable to type 'number'
如果我定期编写这个函数(使用function
关键词):
function decimalToPercent(value: null): null;
function decimalToPercent(value: number): number;
function decimalToPercent(value: number | null): number | null {
if (!value) {
return null;
}
return value * 100;
}
它可以正常工作。
我需要使用箭头功能所以this
不会改变,我需要这个重载,以便打字稿知道decimalToPercent(1)
不能为空。
为什么它不像我那样工作,我该如何修复它?
重载签名和实现签名之间的兼容性规则比分配规则宽松得多。
在这种情况下,您尝试分配一个可能返回的函数null
具有禁止返回 null ((value: number): number;
)。编译器肯定会发现这很麻烦。对于重载,由于签名和实现都是作为一个单元编写的,因此编译器假设“您知道自己在做什么”(无论正确与否)。
您可以通过多种方式解决这个问题:
您可以使用类型断言,尽管您将失去大多数实现、签名兼容性的类型检查:
type INumberConverter = {
(value: number): number;
(value: null): null;
};
const decimalToPercent = ((value: number | null): number | null => {
if (!value) {
return null;
}
return value * 100;
}) as INumberConverter;
您也可以使用常规的function
并捕获this
和旧的一样ES5
天,尽管这个解决方案意味着复制大量的函数签名:
type INumberConverter = {
(value: number): number;
(value: null): null;
};
class X {
decimalToPercent: INumberConverter;
multiper = 100;
constructor() {
let self = this;
function decimalToPercent(value: number): number;
function decimalToPercent(value: null): null;
function decimalToPercent(value: number | null): number | null {
if (!value) {
return null;
}
// use self
return value * self.multiper;
};
this.decimalToPercent = decimalToPercent;
}
}
或者可能最简单的解决方案是使用bind
在构造函数中并将该函数编写为常规方法:
class X {
decimalToPercent(value: number): number;
decimalToPercent(value: null): null;
decimalToPercent(value: number | null): number | null {
if (!value) {
return null;
}
return value * this.multiper;
};
multiper = 100;
constructor() {
this.decimalToPercent = this.decimalToPercent.bind(this);
}
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)