检查 String 是否为 TypeScript 中的 Union 类型

作者

在 TypeScript 中检查字符串是否为联合类型

Check if a String is in Union type in TypeScript

检查字符串是否在联合类型中：

  1. 创建一个将字符串作为参数的可重用函数。
  2. 添加数组联合类型的值。
  3. 使用includes()方法检查字符串是否包含在数组中。
索引.ts
type Sizes = 'small' | 'medium' | 'large';

function isOfType(value: string): value is Sizes {
  return ['small', 'medium', 'large'].includes(value);
}

console.log(isOfType('small')); // 👉️ true
console.log(isOfType('medium')); // 👉️ true
console.log(isOfType('test')); // 👉️ false

我们创建了一个可重用的函数，它将一个字符串作为参数，并
true在该字符串是
联合类型的一部分时返回
，false否则返回。

Array.includes
方法采用
一个值和一个布尔结果来判断该值是否包含在数组中。

语法value is Sizes是
类型谓词。

谓词采用 的形式parameter is Type，其中是函数签名中参数的名称。 parameter

如果它与原始类型兼容，这允许 TypeScript 将变量缩小为特定类型。

让我们看看它在if声明中是如何工作的。

索引.ts
type Sizes = 'small' | 'medium' | 'large';

function isOfType(value: string): value is Sizes {
  return ['small', 'medium', 'large'].includes(value);
}

const sm = 'small';

if (isOfType(sm)) {
  // 👇️ const sm: "small"
  console.log(sm);
} else {
  // 👇️ const sm: never
  console.log(sm);
}

请注意，在if块中，sm变量的类型是正确的，并且它的类型never与else块中的类型相同。

如果我们不使用类型谓词，TypeScript 将无法区分ifandelse块中变量的类型。

索引.ts
type Sizes = 'small' | 'medium' | 'large';

// 👇️ removed type predicate
function isOfType(value: string) {
  return ['small', 'medium', 'large'].includes(value);
}

const sm = 'small';

if (isOfType(sm)) {
  // 👇️ const sm: "small"
  console.log(sm);
} else {
  // 👇️ const sm: "small"
  console.log(sm);
}

现在sm变量的类型在ifandelse块中是相同的。

如果我将类型谓词添加回去并使用不在联合中的字符串调用函数，sm则块中变量的类型if将为never.

索引.ts
type Sizes = 'small' | 'medium' | 'large';

function isOfType(value: string): value is Sizes {
  return ['small', 'medium', 'large'].includes(value);
}

const sm = 'TEST';

if (isOfType(sm)) {
  // 👇️ const sm: never
  console.log(sm);
} else {
  // 👇️ const sm: "TEST"
  console.log(sm);
}

–