如何在Typescript中把枚举转换为对象阵列?

150 阅读1分钟

Enum 是typescript中引入的新数据类型。它的数据是一组常数。 对象中的数据是字符串和数字类型。enum

你可以查看我关于typescript Enum object 的其他文章。

对象是用{}括起来的键和值属性,数组是用[]括起来的一组类型。

Enum和数组对象有不同的类型和结构,我们必须写一段代码来处理转换,以便在UI元素的下拉菜单中显示。
我们有很多方法可以做到 将枚举转换为对象的数组,

但我将使用ES8的Object.entry

给出一个枚举声明

export enum Weeks {  
    MONDAY = 1,  
    TUESDAY= 2,  
    WEDNESDAY = 3,  
    THURSDAY = 4,  
    FRIDAY = 5,  
    SATURDAY=6,  
    SUNDAY=7,  
}

这篇文章讲述了如何转换为对象数组,如下所示

[ { id: 1, name: 'MONDAY' },  { id: 2, name: 'TUESDAY' },  
  { id: 3, name: 'WEDNESDAY' },  
  { id: 4, name: 'THURSDAY' },  { id: 5, name: 'FRIDAY' },  
  { id: 6, name: 'SATURDAY' },  { id: 7, name: 'SUNDAY' } ] 

ES8 Object. entries in JavaScript

ES8 引入了Object.entries() 方法,该方法在最新的浏览器中工作,在旧的浏览器中需要 polyfill支持。

  • 使用Object. entries()方法检索键和值。
  • 使用for-of循环遍历枚举数据的每个元素。
  • 检查数字的键值,忽略字符串的ID。
  • 使用push方法将键和值的数组添加到新创建的数组中。
  
const arrayObjects = []  
      
for (const [propertyKey, propertyValue] of Object.entries(Weeks)) {  
      if (!Number.isNaN(Number(propertyKey))) {  
        continue;  
    }  
    arrayObjects.push({ id: propertyValue, name: propertyKey });  
}  
  
console.log(arrayObjects);  

总结

在这篇文章中,你学到了如何将Enum转换成typecript数组的例子