How to Get All Keys from an Object in JavaScript

In JavaScript, objects store data as key-value pairs. Sometimes, you may need to retrieve all the keys from an object to access or manipulate its data. JavaScript provides several methods to achieve this, depending on your needs. This post will explore different techniques for retrieving the keys from an object.

Table of Contents

1. Using Object.keys()
2. Using Object.getOwnPropertyNames()
3. Using a for...in Loop
4. Using Reflect.ownKeys()
5. Conclusion

1. Using Object.keys()

The Object.keys() method returns an array of an object's own enumerable property keys. This is the most commonly used method to get the keys from an object.

Example:

const employee = {
  firstName: "Ramesh",
  lastName: "Fadatare",
  email: "ramesh.fadatare@gmail.com"
};

const keys = Object.keys(employee);
console.log(keys);

Output:

["firstName", "lastName", "email"]

Explanation:

Object.keys(employee) returns an array containing all the keys of the employee object. This method only returns the object's own properties, not inherited ones.

2. Using Object.getOwnPropertyNames()

The Object.getOwnPropertyNames() method returns an array of all properties found directly on the object, including non-enumerable properties.

Example:

const employee = {
  firstName: "Ramesh",
  lastName: "Fadatare",
  email: "ramesh.fadatare@gmail.com"
};

const keys = Object.getOwnPropertyNames(employee);
console.log(keys);

Output:

["firstName", "lastName", "email"]

Explanation:

Object.getOwnPropertyNames(employee) returns an array with all the property names, including non-enumerable ones. In this example, all properties are enumerable, so the output is the same as Object.keys().

3. Using a for...in Loop

The for...in loop iterates over all enumerable properties of an object, including inherited properties from the prototype chain. If you only want the object's own properties, you can combine it with hasOwnProperty().

Example:

const employee = {
  firstName: "Ramesh",
  lastName: "Fadatare",
  email: "ramesh.fadatare@gmail.com"
};

for (let key in employee) {
  if (employee.hasOwnProperty(key)) {
    console.log(key);
  }
}

Output:

firstName
lastName
email

Explanation:

The for...in loop checks each property of the employee object and prints the key if it is an own property. This method is useful when dealing with objects that may inherit properties from their prototypes.

4. Using Reflect.ownKeys()

The Reflect.ownKeys() method returns an array of all property names (both enumerable and non-enumerable), including symbols, found directly on an object.

Example:

const employee = {
  firstName: "Ramesh",
  lastName: "Fadatare",
  email: "ramesh.fadatare@gmail.com"
};

const keys = Reflect.ownKeys(employee);
console.log(keys);

Output:

["firstName", "lastName", "email"]

Explanation:

Reflect.ownKeys(employee) returns an array of all the own properties of the object, including symbol properties. In this case, it behaves similarly to Object.keys() and Object.getOwnPropertyNames() since there are no symbols or non-enumerable properties.

Conclusion

There are several ways to get all keys from an object in JavaScript, depending on whether you want to include only own properties or also inherited ones, as well as whether you need to handle non-enumerable properties or symbols.

Summary of Methods:

• Object.keys(): Returns an array of the object's own enumerable property keys.
• Object.getOwnPropertyNames(): Returns an array of all own property keys, including non-enumerable properties.
• for...in loop: Iterates over all enumerable properties, including inherited ones.
• Reflect.ownKeys(): Returns an array of all own property keys, including symbols and non-enumerable properties.