How can I get the index of an object by its property in JavaScript?

Digging deeper into techniques and scenarios

Using map() and indexOf() combination for older browsers

If ES6 compatibility isn't guaranteed in your environment, mix map() and indexOf():

var items = [{ id: 1 }, { id: 2 }];
var values = items.map(function(item) {
  return item.id;
});
var index = values.indexOf(2); // index is 1 (Internet Explorer says hi!)


Check for browser support when using specific methods like findIndex() to prevent unexpected bugs.

Crafting a custom function for nested or complex situations

For tricky cases involving nested properties or conditions, a crafted function looping over the array becomes your best friend:

function findIndexByProperty(array, propName, propValue) {
  for(var i = 0; i < array.length; i++) {
    if(array[i][propName] === propValue) {
      return i; // Found it! Now to find my lost socks...
    }
  }
  return -1; // Not found...like my lost socks.
}


This function is a reusable piece of art, offering flexibility for varying property searches.

Beefing up efficiency in large datasets

While findIndex() provides a direct solution, considering efficiency is a responsible act when handling large datasets. As findIndex() stops as soon as it matches, it's like hitting the jackpot at the first slot machine in Las Vegas!

Dealing with non-existence, the phantom menace

Understanding that findIndex() returns -1 when the property isn't found is essential for error-checking and avoiding phantom results:

const index = items.findIndex(item => item.id === 3); // index is -1 (Not found, it's a trap!)


Mastering good practices

Embracing method chaining for cleaner code

In situations demanding multiple operations like sorting and locating the index, chaining methods delivers a clean look:

const index = items.sort((a, b) => a.id - b.id).findIndex(item => item.id === 2); // Single liner for the win!


Keeping sorting logic separate

While chaining appears clean, sometimes, isolating sorting logic from index retrieval leads to more maintainable and easy-to-understand code. It's like keeping bread away from your digital toaster.

Navigating through MDN Documentation

Official MDN documentation is an essential guidebook in your JavaScript journey. Always keep it at your fingertips!

To sort or to rebel against it, that is the question

Sorting is often associated with finding an index but is a fundamentally distinct task. If you need to find 'John' after sorting by name, ensure you sort first and then search:

const people = [{ name: 'Mary' }, { name: 'John' }, { name: 'Steve' }];
people.sort((a, b) => a.name.localeCompare(b.name));
const index = people.findIndex(person => person.name === 'John'); // index depends on your diplomatic skills with the sorting


As always, make sure you're prepared to tackle these impositions when they arise!