枚举值的数组:检查枚举键与Array.includes?

Question

我有以下TypeScript Enum:

export enum Brennstoff {
OEL = "Öl",
GAS = "Gas",
SOLAR = "Solar",
}

我有一个Brennstoff的多选输入，它返回一个键数组:

const selected = ["GAS", "SOLAR"]

如何检查数组是否包含条目?

selected.includes(Brennstoff.GAS)

操场上联系

因为Brennstoff.GAS返回Gas，所以它查找值，但是我需要查找键。

如何在TypeScript中做到这一点?

Answer 1

简介&TL;博士

有两个解决方案，它们都依赖于我们将在下面介绍的一些设置:

1. 使用更严格的selected类型，因此它只能包含有效的Brennstoff密钥，它看起来像:

   console.log(selected.some(key => Brennstoff[key] === Brennstoff.GAS)); // true
   console.log(selected.some(key => Brennstoff[key] === Brennstoff.OEL)); // false
   

2. 保持selected作为string[]，它看起来像:

   console.log(selected.some(key => isBrennstoffKey(key) && Brennstoff[key] === Brennstoff.GAS)); // true
   console.log(selected.some(key => isBrennstoffKey(key) && Brennstoff[key] === Brennstoff.OEL)); // false
   

确认键两种解决方案都涉及验证字符串是否为有效的Brennstoff密钥，因此让我们先看一下:

可以使用类型断言函数来验证键。Brennstoff键的类型是keyof typeof Brennstoff，但是您可能会发现为它设置一个别名很有用:

type BrennstoffKey = keyof typeof Brennstoff;

那么断言函数看起来像这样:

const BrennstoffKeys = new Set(Object.keys(Brennstoff));
function assertBrennstoffKey(key: string): asserts key is BrennstoffKey {
if (!BrennstoffKeys.has(key)) {
throw new Error(`Invalid Brennstoff key "${key}"`);
}
}

(您不必使用Set，您可以在每次想要进行验证时调用Object.keys)

我冒昧地假设每个值只有一个键。

我发现我经常需要类型保护版本和断言版本;这个组合就像这样:

const BrennstoffKeys = new Set(Object.keys(Brennstoff));
function isBrennstoffKey(key: string): key is BrennstoffKey {
return BrennstoffKeys.has(key);
}
function assertBrennstoffKey(key: string): asserts key is BrennstoffKey {
if (!isBrennstoffKey(key)) {
throw new Error(`Invalid Brennstoff key "${key}"`);
}
}

让我们看两种方法…

selected使用更严格的类型

如果selected将包含来自Brennstoff的键名，那么我建议这样声明-BrennstoffKey[]:

const selected: BrennstoffKey[] = [];

然后在添加字符串之前验证它们:

let key: string = /*...*/;
assertBrennstoffKey(key);
selected.push(key);

检查它是否有键，因为selected的类型足够严格，我们可以使用some来检查它是否有特定值的键:

console.log(selected.some(key => Brennstoff[key] === Brennstoff.GAS)); // true
console.log(selected.some(key => Brennstoff[key] === Brennstoff.OEL)); // false

操场上联系

selected为string[]

如果你想保持selected作为string[]，那么我们在做检查时应用验证:

如果您愿意做一些前期准备(可能只是在定义Brennstoff之后)，这是相当简单的:

console.log(selected.some(key => isBrennstoffKey(key) && Brennstoff[key] === Brennstoff.GAS)); // true
console.log(selected.some(key => isBrennstoffKey(key) && Brennstoff[key] === Brennstoff.OEL)); // false

操场上联系