Angular 为什么我应该使用谓词作为返回类型而不是布尔类型？

在阅读本文时，我刚刚了解了用户定义的typeguards：

在本文的一个示例中，他们使用

petisfish

作为方法返回类型，该返回类型是谓词

---

我发现与其使用这种返回类型，不如使用

boolean

。那么，

参数is Type

returntype只是语法上的糖类，还是有特定用途

如果返回一个

布尔值

函数，则该函数将是一个简单函数，而不是typeguard。

pet is Fish

语法向编译器发出信号，表明此函数将影响参数的类型

例如：

class Fish { f: boolean }
class Dog { d: boolean; }

declare let x: Fish | Dog;
declare function isFish(p: Fish | Dog): boolean
declare function isFishGuard(p: Fish | Dog): p is Fish;

if (isFishGuard(x)) {
    x.f // x is Fish
}

if (isFish(x)) {
    x.f // error x is still Fish|Dog
}

---

链接中说明了具体用途。如果您对未知类型的变量进行了类型检查，并且它的计算结果为真，那么typescript知道该变量是鱼，您可以安全地将其视为鱼。为什么第二个

If

会根据您的判断给出错误？我注意到，当您将变量声明为

type1 | type2

时，该变量将同时获得type1和type2的属性，这意味着在通过typeguard确定实际类型后，无需将变量强制转换为这两种类型中的任何一种。因此，在您的示例中，如果x的实际类型不是fish，那么第二个if中的

x.f

将只返回值

undefined

。@Maurice

type1 | type2

是联合类型，这意味着它可以是

type1

或

type2

。Typescript只允许您访问此类类型的公共属性（在本例中没有公共属性）<代码>类型1和类型2是一种交叉类型，允许访问这两种类型的属性。类型保护旨在将联合类型（在本例中为

Fish | Dog

）缩小为更具体的类型（在本例中为

isFishGuard

将

x

的类型缩小为

Fish

）请查看我在

编辑：

下发布的代码片段。这运行时没有错误。AdvancedFilter和HTMLInputElement都没有名为

value

的属性，只有HTMLInputElement具有此属性，然而，在

else

部分中，我仍然可以调用

filter.value

，而不必先将

filter

转换为

HTMLInputElement

。@Maurice如果没有

的定义，它就是高级过滤器

和

高级过滤器

很难判断发生了什么。你可以在操场上试试我的样品，你会在第二次进入时出错。我会在答案中添加一个游乐场链接。不过，我已经从帖子中删除了编辑内容，因为你是对的。虽然类

AdvancedFilter

没有声明

值

成员，但该类确实继承了超类

对象/any

的所有成员。该类碰巧有一个

值

成员，这解释了为什么在未首先强制转换到

HTMLInputElement

的情况下使用该成员时不会出现运行时错误。