如何在打字稿中解构枚举值？

Question

我在打字稿中有一个枚举，如下所示：

export enum XMPPElementName {
  state = "state",
  presence = "presence",
  iq = "iq",
  unreadCount = "uc",
  otherUserUnreadCount = "ouc",
  sequenceID = "si",
  lastSequenceID = "lsi",
  timeStamp = "t",
  body = "body",
  message = "message"
}

并且想要分解其价值，我们如何在Typescript中做到这一点？

const { uc, ouc, msg, lsi, si, t, body } =  XMPPElementName; 

更新

作为@amadan mentioned，我们可以使用Assigning to new variable names，就像Mozilla文档中所说的Destructuring_assignment一样，

分配新的变量名

可以从对象中解压缩属性，然后将其分配给名称与对象属性不同的变量。

const o = {p: 42, q: true};
const {p: foo, q: bar} = o;
 
console.log(foo); // 42 
console.log(bar); // true

该方法对于解决此问题非常有用，但是如果您需要访问所有项目而无需显式定义它们，则可以在上述两个tag1 tag2中选择一个

Answer 1

const { uc, ouc, msg, lsi, si, t, body } =  XMPPElementName; 

这不起作用，因为XMPPElementName没有名为uc的元素（对于其他元素则等效）。如果您明确命名密钥，它将起作用：

  const {
    unreadCount: uc,
    otherUserUnreadCount: ouc,
    message: msg,
    lastSequenceID: lsi,
    sequenceID: si,
    timeStamp: t,
    body: body,
  } = XMPPElementName;

它将起作用。或者，您可以只使用名称等于键的变量，而不是值：

  const {
    unreadCount,
    otherUserUnreadCount,
    message,
    lastSequenceID,
    sequenceID,
    timeStamp,
    body,
  } = XMPPElementName;

Answer 2

我们知道，在打字稿中，枚举就像一个普通的旧javascript对象（至少是Playground js输出显示的内容或日志显示的内容）：

一种方法是使用一个函数，该函数生成具有{value:value}结构的新对象，如下所示：

export function convertEnumValuesToObject<T>(enumObj: T): { [index: string]: T[keyof T] } {
  const enum_values = Object.values(enumObj);
  return Object.assign({}, ...enum_values.map(_ => ({ [_]: _ })));
}

  const { uc, ouc, msg, lsi, si, t, body } = convertEnumValuesToObject(
      XMPPElementName
    ); 

很高兴看到打字稿中的答案？

Answer 3

您需要一个枚举值对值映射。就像您说的JS中的枚举只是POJO。您可以创建实用程序类型来帮助生成正确的类型。

type EnumValueMap<T extends { [k: string]: string }> = { [K in T[keyof T]]: K }

function convertEnumValuesToObject<T extends { [k: string]: string }>(enumerable: T): EnumValueMap<T> {
  return (Object as any).fromEntries(Object.values(enumerable).map(v => [v, v]))
}

Playground Link