Get an Object's Key or Value by Index in JavaScript

avatar
Borislav Hadzhiev

Last updated: Mar 3, 2024
3 min

banner

# Table of Contents

  1. Get a Value of an Object by Index in JavaScript
  2. Get an Object's Key by Index in JavaScript

# Get a Value of an Object by Index in JavaScript

To get a value of an object by index:

  1. Use the Object.values() method to get an array of the object's values.
  2. Use bracket notation to access the value at the specified index.
index.js
const obj = {country: 'Chile', name: 'bobby hadz'}; const firstValue = Object.values(obj)[0]; console.log(firstValue); // ๐Ÿ‘‰๏ธ "Chile" const firstKey = Object.keys(obj)[0]; console.log(firstKey); // ๐Ÿ‘‰๏ธ "country"

get value of object by index

The code for this article is available on GitHub

The Object.values() method returns an array of the object's values.

index.js
const obj = {country: 'Chile', name: 'bobby hadz'}; // ๐Ÿ‘‡๏ธ [ 'Chile', 'bobby hadz' ] console.log(Object.values(obj));

The order of the array returned by the Object.values() method is the same as that provided in a for...in loop.

JavaScript indexes are zero-based, so the first element in an array has an index of 0 and the last element has an index of array.length - 1.

If you try to access the array at an index that's out of bounds, you would get an undefined value back.

index.js
const obj = {country: 'Chile', name: 'bobby hadz'}; console.log(Object.values(obj)); // ๐Ÿ‘‰๏ธ [ 'Chile', 'bobby hadz' ] console.log(Object.values(obj)[100]); // ๐Ÿ‘‰๏ธ undefined

The object doesn't have a value at index 100, so the expression returns undefined.

A more indirect approach is to use the Object.keys() method.

# Get an Object's Key by Index in JavaScript

To get an object's key by index:

  1. Call the Object.keys() method to get an array of the object's keys.
  2. Use bracket notation to access the key at the specified index.
index.js
const obj = {number: 5, color: 'blue'}; const secondKey = Object.keys(obj)[1]; console.log(secondKey); // ๐Ÿ‘‰๏ธ "color"

get object key by index

The code for this article is available on GitHub

We used the Object.keys() method to get an array of the object's keys.

index.js
const obj = {number: 5, color: 'blue'}; console.log(Object.keys(obj)); // ๐Ÿ‘‰๏ธ ['number', 'color']

The only parameter the method takes is the object, for which to return the keys.

The ordering of the keys in the array is the same as provided by a for...in loop.

The last step is to access the array of keys at the specified index.

JavaScript indexes are zero-based, so the first element in an array has an index of 0 and the last element has an index of array.length - 1.

If you try to get a key at an index that's out of bounds, you will get an undefined value back.

index.js
const obj = {number: 5, color: 'blue'}; console.log(Object.keys(obj)[100]); // ๐Ÿ‘‰๏ธ undefined

If you need to get an object's value by index, you would use the Object.values() method.

index.js
const obj = {name: 'Alice', age: 30}; const firstValue = Object.values(obj)[0]; console.log(firstValue); // ๐Ÿ‘‰๏ธ "Alice"

The Object.values() method returns an array of the object's values.

index.js
const obj = {name: 'Alice', age: 30}; // ๐Ÿ‘‡ ['Alice', 30] console.log(Object.values(obj));

You can you bracket notation to access the value at a specific index, just like we did with the array of keys.

There is also an Object.entries() method that you can use to get an object's key-value pair by index.

index.js
const obj = {number: 5, color: 'blue'}; const entries = Object.entries(obj); const [key, value] = entries[0]; console.log(key); // ๐Ÿ‘‰๏ธ number console.log(value); // ๐Ÿ‘‰๏ธ 5
The code for this article is available on GitHub

The Object.entries() method returns an array of the object's key-value pairs.

index.js
const obj = {number: 5, color: 'blue'}; const entries = Object.entries(obj); // ๐Ÿ‘‡๏ธ [ [ 'number', 5 ], [ 'color', 'blue' ] ] console.log(entries);

The first element in each nested array is the key and the second is the value.

# Get a Value of an Object by Index using Object.keys()

This is a three-step process:

  1. Use the Object.keys() method to get an array of the object's keys.
  2. Use bracket notation to get the key at the specific index.
  3. Access the object by the key to get the corresponding value.
index.js
const obj = {country: 'Chile', name: 'bobby hadz'}; const keys = Object.keys(obj); console.log(obj[keys[0]]); // ๐Ÿ‘‰๏ธ Chile

get value of object by index using object keys

The code for this article is available on GitHub

The Object.keys() method returns an array of the object's keys.

index.js
const obj = {country: 'Chile', name: 'bobby hadz'}; const keys = Object.keys(obj); console.log(keys); // ๐Ÿ‘‰๏ธ [ 'country', 'name' ]

We have to get the key at the specified index and use it to get the corresponding value.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.

Copyright ยฉ 2024 Borislav Hadzhiev