如何修复类型为is的实参不能赋值给类型为is的形参

Question

我试图在反应类型脚本中过滤我的对象数组。得到这个错误。下面是我的界面，状态和函数

TS2345:参数类型'(previous: IBudget, current: IBudget) =>IBudget | undefined'不能赋值给类型为'的参数(previousValue: IBudget, currentValue: IBudget, currentIndex: number, array: IBudget[]) =>IBudget"。
类型'IBudget | undefined'不能赋值给类型'IBudget'。类型'undefined'不能赋值给类型'IBudget'。

export interface IBudget {
title?:string,
price?:number,
date?: Date,
}
const [expenses,setExpenses] = useState<IBudget[]>([])
if (!isEmpty(expenses)){
const max = expenses.reduce((prev , current)=> {
if( prev !== undefined) {
if (prev.price !== undefined && current.price !== undefined){
return (prev.price > current.price) ? prev : current
}
}
}) 
}

Answer 1

这可能是因为您没有传递初始值给reduce函数，并且根据您的实现，您可以传递expenses数组的第一个参数

const max = expenses.reduce((prev, current) => {
if (prev !== undefined) {
if (prev.price !== undefined && current.price !== undefined) {
return prev.price > current.price ? prev : current;
}
}
}, expenses[0]);

在您这样做之后，您可能会有另一个错误，说previous或current类型与undefined不匹配。这是因为if's可能无法输入，对吧?如果发生这种情况，你的代码将返回undefined到下一个交互。

为了解决这个问题，您需要确保在下一次迭代中返回一些值，如下所示:

const max = expenses.reduce((prev, current) => {
if (prev !== undefined) {
if (prev.price !== undefined && current.price !== undefined) {
return prev.price > current.price ? prev : current;
}
}
// here you might have to adjust to your needs
return current;
}, expenses[0]);

Answer 2

reduce的类型定义将自动将返回类型设置为数组类型-number[]被假定为减少为number。

您可以通过传递与期望返回值相同类型的initialValue或使用泛型(或两者)设置它来覆盖此:

[1,2,3].reduce<number | string>(...)

在您的情况下，不清楚您想要的结果是什么。你是否打算退回undefined?如果没有，则需要处理两个if语句没有通过的情况，因为缺少return是导致undefined类型推断的原因。

如果您确实想要未定义的可能性，您可以简单地设置类型，并传入initialValue:

const max = expenses.reduce<IBudget | undefined>((prev , current)=> {
if( prev !== undefined) {
if (prev.price !== undefined && current.price !== undefined){
return (prev.price > current.price) ? prev : current
}
}
}, undefined)