How to show the name of all arrays inside an object?

Question

I’m making a search system and with a problem to show the name of the arrays inside the object.

The object is in this style:

let item = {
descricao: "Casa",
id: 123,
localizacoesFilho: [
    {
        descricao: "Cozinha",
        id: 124
    },
    {
        descricao: "Garagem",
        id: 125
    }
]
}

And the code I’m using is this:

searchLocalizacao(item) {
  if (item.descricao) {

    if(item.localizacoesFilho && item.localizacoesFilho.length > 0) {
        return item.localizacoesFilho[0].descricao.toLowerCase().indexOf(this.q.toLowerCase()) == -1;
    }

    item.descricao.toLowerCase().indexOf(this.q.toLowerCase()) == -1;
  }
};

This code is showing the items that do not have an array normally, but the items that have an array it only shows the name if it is the first one, as I do to show the name of the array that the user is searching for regardless of its position?

Obs: the this.q is storing the letters I type in the input.

Answer 1

Your problem is here:

item.localizacoesFilho[0]

You are only taking the first element of it (0) and comparing, what you need is to iterate through all the objects within a localizacoesFilho and return those that match your condition, to do this you can use methods like the filter that will go through each element of your array and apply the test you set as parameter, such method will return a new array with only the objects that passed the preset test, example:

// Só para evitar de ter que converter para lowerCase em cada teste
const pesquisarPor = this.q.toLowerCase();

// Aplicamos um filtro no array, o teste é uma função que será chamada para cada elemento no array e deve retornar true ou false, se true o elemento será incluso no array filhosFiltrados
const filhosFiltrados = item.localizacoesFilho.filter(function(itemFilho){
   return itemFilho.descricao.toLowerCase().indexOf(pesquisarPor) > -1;
});

Simple example:

const item = {
  descricao: "Casa",
  id: 123,
  localizacoesFilho: [
      {
          descricao: "Cozinha",
          id: 124
      },
      {
          descricao: "Garagem",
          id: 125
      }
  ]
}


function searchLocalizacao(localizacao){
  const filhosFiltrados = item.localizacoesFilho.filter(function (filhoItem){
     return filhoItem.descricao.toLowerCase().indexOf(localizacao.toLowerCase()) > -1;
  });
  
  console.log(filhosFiltrados);
  return filhosFiltrados;
}

searchLocalizacao('a'); // Cozinha e Garagem
searchLocalizacao('G'); // Garagem
searchLocalizacao('oz'); // Cozinha