迹忆客 专注技术分享

当前位置:主页 > 学无止境 > 编程语言 > TypeScript >

在 TypeScript 中将枚举转换为对象数组

作者:迹忆客 最近更新:2022/12/28 浏览次数:

将枚举转换为对象数组:

  1. 使用 Object.keys() 方法获取枚举键的数组。
  2. 过滤掉数字枚举的不必要值。
  3. 使用 map() 方法迭代数组,每次迭代返回一个对象。
// ✅ For NUMERIC Enums
enum NumericEnum {
  Small,
  Medium,
  Large,
}

const arr1 = Object.keys(NumericEnum)
  .filter((v) => isNaN(Number(v)))
  .map((name) => {
    return {
      id: NumericEnum[name as keyof typeof NumericEnum],
      name,
    };
  });

// 👇️ [{id: 0, name: 'Small'}, {id: 1, name: 'Medium'}, {id: 2, name: 'Large'}]
console.log(arr1);

// ✅ For STRING Enums
enum StringEnum {
  Small = 'S',
  Medium = 'M',
  Large = 'L',
}

const arr2 = Object.keys(StringEnum).map((name) => {
  return {
    name,
    value: StringEnum[name as keyof typeof StringEnum],
  };
});

// 👇️ [{name: 'Small', value: 'S'}, {name: 'Medium', value: 'M'}, {name: 'Large', value: 'L'}]
console.log(arr2);

TypeScript 中将枚举转换为对象数组

代码片段显示了如何将数字和字符串枚举转换为对象数组。

TypeScript 中的枚举是真实的对象,存在于运行时,因此我们可以使用 Object.keys 方法来获取枚举的键数组。

// ✅ For NUMERIC Enums
enum NumericEnum {
  Small,
  Medium,
  Large,
}

// 👇️ ['0', '1', '2', 'Small', 'Medium', 'Large']
console.log(Object.keys(NumericEnum));

// ✅ For STRING Enums
enum StringEnum {
  Small = 'S',
  Medium = 'M',
  Large = 'L',
}

// 👇️ ['Small', 'Medium', 'Large']
console.log(Object.keys(StringEnum));

数字枚举的输出包括值,因此我们必须使用 filter() 方法从数组中过滤掉任何不需要的值。

最后一步是使用 Array.map 方法遍历枚举名称数组,并在每次迭代时返回一个包含名称和值的对象。

我们在示例中使用 keyof typeof 将字符串转换为枚举,因此我们可以访问相应的值。

如果我们需要一个包含名称或字符串枚举值的数组,我们可以使用 Object.keys()Object.values() 方法。

// ✅ For STRING Enums
enum StringEnum {
  Small = 'S',
  Medium = 'M',
  Large = 'L',
}

const keys2 = Object.keys(StringEnum);
// 👇️ ['Small', 'Medium', 'Large']
console.log(keys2);

const values2 = Object.values(StringEnum);
// 👇️ ['S', 'M', 'L']
console.log(values2);

数字枚举的方法类似,但由于 Object.keys() 方法返回键和值,我们必须过滤掉不需要的值。

// ✅ For NUMERIC Enums
enum NumericEnum {
  Small,
  Medium,
  Large,
}

const names1 = Object.keys(NumericEnum).filter((v) => isNaN(Number(v)));
console.log(names1); // 👉️ ['Small', 'Medium', 'Large']

const values1 = Object.values(NumericEnum).filter((v) => !isNaN(Number(v)));
console.log(values1); // 👉️ [0, 1, 2]

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

在 TypeScript 中返回一个 Promise

发布时间:2023/03/19 浏览次数:182 分类:TypeScript

本教程讨论如何在 TypeScript 中返回正确的 Promise。这将提供 TypeScript 中 Returns Promise 的完整编码示例,并完整演示每个步骤。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便