{

Best Five ways to iterate enum in typescript with examples?


create an empty typed array of object and interface in typescript

Enum is an enumeration of names and values replacing multiple constants with a single namespace. There are many ways we can iterate enum data.

This blog post covers examples for looping the Enum string of numbers using different approaches.

You can check my other posts on typescript Enum object.

How to Iterate keys and values using Object Inbuilt methods

An enum is also an object in Javascript. Object class provides the following methods

  • The Object.keys() method returns an array of the keys of an object
  • The Object.values() method returns an array of values or properties of an object
  • The Object.entries() method returns Multimap of an enumeration, It is introduced in the latest Javascript language

let us declare Enum in javascript or typescript

export enum Status {
  ACTIVE = "active",
  INACTIVE = "inactive",
  PENDING = "pending",
  COMPLETED = "completed",
}

An example to getting keys of an Enum object

const keys=Object.keys(Status);
console.log(keys)//[ 'ACTIVE', 'INACTIVE', 'PENDING', 'COMPLETED' ]

An example to retrieving keys of an Enum

const values=Object.values(Status);
console.log(values)//[ 'active', 'inactive', 'pending', 'completed' ]

iterate Multiple Map key and values of an enum

const entries=Object.entries(Status);
console.log(entries)

Output:

[
  ["ACTIVE", "active"],
  ["INACTIVE", "inactive"],
  ["PENDING", "pending"],
  ["COMPLETED", "completed"],
];

using in operator with for loop

in the operator in Javascript, check property exists in an object and returns true. The enum object stores the key and value pair in both normal and reverse order. Each property iterated and printed property name and its value using Enum[property]

for (let element in Status) {
  console.log(element + " - " + Status[element]);
}

And the output:

ACTIVE - active
INACTIVE - inactive
PENDING - pending
COMPLETED - completed

forIn lodash method

forIn function in lodash is used to iterate the own enumerated properties of an object Since enum is an object. forIn is used to iterate keys and values of an enum. Iterate each key and value pair and apply the call back for each iteration, It can take an object, callback value, and key pairs.

_.forIn(Status, function(value, key) {
    console.log(key +" - "+ value]);
});

get of properties of an Enum with no value

In the above examples, Enum is declared with property and its value and checked various approaches to do iteration.

Now we will see the list of enum strings that has no values.

export enum Status {
  ACTIVE,
  INACTIVE,
  PENDING,
  COMPLETED,
}
console.log(Status);

And enum object printed the below format,

{ '0': 'ACTIVE',
  '1': 'INACTIVE',
  '2': 'PENDING',
  '3': 'COMPLETED',
  ACTIVE: 0,
  INACTIVE: 1,
  PENDING: 2,
  COMPLETED: 3 }

loop each element of an object using for loop within the operator or object method check each element value is not a number and the isNan method.

const statuslist = Object.keys(Status).filter((element) => {
  return isNaN(Number(element));
});
console.log(statuslist);

for (let element in Status) {
  if (isNaN(Number(element))) {
    console.log(element);
  }
}

And output

[ 'ACTIVE', 'INACTIVE', 'PENDING', 'COMPLETED' ]
ACTIVE
INACTIVE
PENDING
COMPLETED

Conclusion

To Summarize, You learned how to iterate an enum key and values using the object lodash method.

THE BEST NEWSLETTER ANYWHERE
Join 6,000 subscribers and get a daily digest of full stack tutorials delivered to your inbox directly.No spam ever. Unsubscribe any time.

Similar Posts
Subscribe
You'll get a notification every time a post gets published here.