How can I find index by key and value in an object (but its completely object without an array)

Question

I am returning the data below from server side laravel.

  response = {
    "1": {
      "id": 1,
      "title": "Port1",
      "code": "P",
      "accounting_code": "119"
    },
    "2": {
      "id": 2,
      "title": "Port2",
      "code": "P2",
      "accounting_code": "120"
    },
    "4": {
      "id": 4,
      "title": "Port3",
      "code": "P3",
      "accounting_code": "122"
    },
    "5": {
      "id": 5,
      "title": "Port4",
      "code": "P4",
      "accounting_code": "123"
    }
  }

The response here does not change even when I turn the collection into an array (toArray()). So I have to process this but when I use this code for example:

response.findIndex( p => p.code == 'P1') // or .find() or .indexOf()

I get an findIndex is not a function error. I know that it has to be an object array to use that function but there must be an easy way to easily process this laravel response on the fly. I mean using the laravels built in response, without converting it somehow.

I think (for sure) I am missing a big concept here which I was not able to spot (realize) on the web just by googling.

Answer 1

Turn the object into an array of entries (an entry is a key-value pair, as an array), and then you can use .find on that array. If an entry matches the condition, you can extract the key (or value, or index) from it:

 const response = { "1": { "id": 1, "title": "Port1", "code": "P", "accounting_code": "119" }, "2": { "id": 2, "title": "Port2", "code": "P2", "accounting_code": "120" }, "4": { "id": 4, "title": "Port3", "code": "P3", "accounting_code": "122" }, "5": { "id": 5, "title": "Port4", "code": "P4", "accounting_code": "123" } }; const entry = Object.entries(response).find(([, obj]) => obj.code === 'P3'); if (entry) { console.log(entry[0]); }

If you don't care about the matching key or the value, just the index, then take the Object.values to get an array and call findIndex on it:

 const response = { "1": { "id": 1, "title": "Port1", "code": "P", "accounting_code": "119" }, "2": { "id": 2, "title": "Port2", "code": "P2", "accounting_code": "120" }, "4": { "id": 4, "title": "Port3", "code": "P3", "accounting_code": "122" }, "5": { "id": 5, "title": "Port4", "code": "P4", "accounting_code": "123" } }; const index = Object.values(response).findIndex(obj => obj.code === 'P3'); console.log(index);

But code generally shouldn't depend on keys of objects having a particular order. While the order is deterministic, it can be somewhat confusing, and numeric array keys like 1 and 5 can only be "ordered" inside an object in ascending numeric order. If you really need the index, you should consider changing the backend to send an array of objects instead of a single object.