无法调用类型缺少呼叫签名的表达式

我有苹果和梨-都有一个isDecayed属性：

interface Apple {
    color: string;
    isDecayed: boolean;
}

interface Pear {
    weight: number;
    isDecayed: boolean;
}

两种类型都可以放在我的水果篮中（多次）：

interface FruitBasket {
   apples: Apple[];
   pears: Pear[];
}

现在假设我的购物篮是空的：

const fruitBasket: FruitBasket = { apples: [], pears: [] };

现在我们从篮子中随机抽取一种：

const key: keyof FruitBasket = Math.random() > 0.5 ? 'apples': 'pears'; 
const fruits = fruitBasket[key];

当然，没有人喜欢腐烂的水果，因此我们只选择新鲜的水果：

const freshFruits = fruits.filter((fruit) => !fruit.isDecayed);

不幸的是打字稿告诉我：

无法调用类型缺少调用签名的表达式。类型'（（callbackfn：（值：苹果，索引：数字，数组：苹果[]）=>任何，thisArg ?:任何）=>苹果[]）| ...'没有兼容的呼叫签名。

这是怎么回事-仅仅是Typescript不喜欢新鲜水果还是这是Typescript错误？

您可以在官方Typescript Repl中自己尝试。

TypeScript支持结构化类型化（也称为鸭子类型化），这意味着类型在共享相同成员时是兼容的。您的问题是Apple并且Pear不共享所有成员，这意味着它们不兼容。但是，它们与仅具有该isDecayed: boolean成员的另一种类型兼容。由于结构打字，你不”需要继承Apple和Pear从这样的接口。

分配这种兼容类型的方法有多种：

在变量声明期间分配类型

该语句隐式键入为Apple[] | Pear[]：

const fruits = fruitBasket[key];

您可以简单地在变量声明中显式使用兼容类型：

const fruits: { isDecayed: boolean }[] = fruitBasket[key];

为了获得更高的可重用性，您还可以先定义类型，然后在声明中使用它（请注意，无需更改AppleandPear接口）：

type Fruit = { isDecayed: boolean };
const fruits: Fruit[] = fruitBasket[key];

强制转换为兼容类型

给定解决方案的问题在于它会更改fruits变量的类型。这可能不是您想要的。为避免这种情况，您可以在操作前将数组缩小为兼容类型，然后将其设置回与以下类型相同的类型fruits：

const fruits: fruitBasket[key];
const freshFruits = (fruits as { isDecayed: boolean }[]).filter(fruit => !fruit.isDecayed) as typeof fruits;

或具有可重用Fruit类型：

type Fruit = { isDecayed: boolean };
const fruits: fruitBasket[key];
const freshFruits = (fruits as Fruit[]).filter(fruit => !fruit.isDecayed) as typeof fruits;

此解决方案的优点是fruits和freshFruits均为type Apple[] | Pear[]。

如在最初由@peter链接的github问题中所述：

const freshFruits = (fruits as (Apple | Pear)[]).filter((fruit: (Apple | Pear)) => !fruit.isDecayed);

也许创建一个Fruit提供isDecayed的共享接口。fruits现在是类型，Fruit[]因此类型可以是显式的。像这样：

interface Fruit {
    isDecayed: boolean;
}

interface Apple extends Fruit {
    color: string;
}

interface Pear extends Fruit {
    weight: number;
}

interface FruitBasket {
    apples: Apple[];
    pears: Pear[];
}


const fruitBasket: FruitBasket = { apples: [], pears: [] };
const key: keyof FruitBasket = Math.random() > 0.5 ? 'apples': 'pears'; 
const fruits: Fruit[] = fruitBasket[key];

const freshFruits = fruits.filter((fruit) => !fruit.isDecayed);

我有一个数字问题，即JS库。解决方法是使用此命令再次安装类型：

npm install --save @types/numeral