-2
let apis = [{id: "1", name"api 1"}, {id: "2", name:"api 2"}, {id: "3", name:"api 3"}];


let applications = [{id: "1", name:"application 01", apis: ["1", "2"]}, {id: "2", name: "application 02", apis: ["2", "3"]}]

Gostaria de um resultado assim:

 let resultado = [
{id: "1", name: "application 01", apis: [{id: "1", name:"api 1"}, {id: "2", name:"api 2"}]}, 
{id: "2", name: "application 02", apis: [{id: "2", name:"api 2"}, {id: "3", name:"api 3"}]}]

Estou querendo que cada api entre em sua respectiva application. Estou meio confusa nas ideias ainda, estou pensando que vai ter que usar provavelmente um reduce, mas não sei como... Poderiam me ajudar por favor

1

5 Respostas 5

4

Você precisa iterar por todos os elementos de 'applications' e para cada um dele verificar todas as 'apis':

let apis = [{id: "1", name: "api 1"}, {id: "2", name:"api 2"}, {id: "3", name:"api 3"}];
let applications = [{id: "1", name:"application 01", apis: ["1", "2"]}, {id: "2", name: "application 02", apis: ["2", "3"]}];

//pasando por todos os 'applications'
resultado = applications.map(function(app) {
  //cada iteração, aqui dentro, um dos elementos de 'applications' é chamado de 'app'
  //abaixo, filtrando as 'apis' conforme o vetor 'apis' dentro do 'app'
  apisSelecionadas = apis.filter(function(api) {
    //só retorna do 'apis' (principal) os elementos que existam dentro da propriedade 'apis' do 'app' 
    return app.apis.indexOf(api.id) !== -1;
  });
  //coloco o resultado no 'app'
  app.apis = apisSelecionadas;

  return app;
});

console.log(resultado)

1
  • tem referencia circular no objeto 22/02/2021 às 17:31
3

Uma opção seria iterar sobre cada elemento de applications e, para cada iteração, procurar, no array apis, o objeto api correspondente:

function groupApplicationApi(applications, apis) {
  // Cria um novo array para não modificar o original:
  const resultingArray = [];

  for (const application of applications) {
    // Também criamos um novo objeto para não modificar o original:
    const applicationObj = { ...application };
    const apiObjs = [];

    for (const apiId of applicationObj.apis) {
      const apiObj = apis.find((api) => api.id === apiId);

      // Se não existir API correspondente, não faça nada:
      if (!apiObj) {
        continue;
      }

      apiObjs.push(apiObj);
    }

    // Adiciona as apis ao novo objeto:
    applicationObj.apis = apiObjs;

    // Adiciona o novo objeto no array resultante:
    resultingArray.push(applicationObj);
  }

  return resultingArray;
}

const apis = [
  { id: '1', name: 'api 1' },
  { id: '2', name: 'api 2' },
  { id: '3', name: 'api 3' }
];

const applications = [
  { id: '1', name: 'application 01', apis: ['1', '2'] },
  { id: '2', name: 'application 02', apis: ['2', '3'] }
];

console.log(
  groupApplicationApi(applications, apis)
);

Mas, de modo geral, o algoritmo acima não é muito performático, uma vez que, para cada elemento de applications, iteraremos (no pior dos cenários) sobre cada elemento de apis.

Desse modo, a complexidade é O(m * n), sendo m o número de elementos de applications e n o número de elementos de apis.

Dá para fazer em O(m + n), o que é indubitavelmente melhor — apesar de causar leve custo em memória, uma vez que teremos que manter um dicionário com cada elemento de apis disponível, indexada pelo respectivo ID.

Enfim, assim:

function groupApplicationApi(applications, apis) {
  const apiDict = Object.create(null); // Cria o dicionário:
  for (const api of apis) {
    apiDict[api.id] = api;
  }

  const resultingArray = [];
  for (const application of applications) {
    const applicationObj = { ...application };
    
    const apiObjs = [];
    for (const apiId of applicationObj.apis) {
      // Note que não utilizamos o `find` (O(n)), apenas uma indexação (O(1)).
      const apiObj = apiDict[apiId];

      if (!apiObj) {
        continue;
      }

      apiObjs.push(apiObj);
    }

    applicationObj.apis = apiObjs;
    resultingArray.push(applicationObj);
  }

  return resultingArray;
}

const apis = [
  { id: '1', name: 'api 1' },
  { id: '2', name: 'api 2' },
  { id: '3', name: 'api 3' }
];

const applications = [
  { id: '1', name: 'application 01', apis: ['1', '2'] },
  { id: '2', name: 'application 02', apis: ['2', '3'] }
];

console.log(
  groupApplicationApi(applications, apis)
);


Note que, nos dois exemplos acima, evitei tentar modificar os elementos originais. Sempre que uma modificação foi necessária no código, foi feita em uma "cópia", e não no original. No entanto, as referências aos objetos de apis foram mantidas.

19
  • 2
    E o que isso tem a ver com referência circular? Até onde sei, parece-me apenas uma referência a um objeto - não uma referência circular. 22/02/2021 às 17:38
  • 2
    @RicardoPontual, eu acho errado usar o termo "circular". Não tem nada de circular (não tem dependência circular e nem referência circular!) no código acima. Ainda acho que você quer dizer "referência" (o que de fato acontece). 22/02/2021 às 17:53
  • 2
    @RicardoPontual, não, realmente não é nenhum desses dois termos, porque, como disse, não tem nada de circular em nenhum dos códigos desta pergunta. O que está acontecendo é a manutenção de uma simples referência. O termo é, portanto, "referência" - e só. Tem que tomar cuidado para não confundir... 22/02/2021 às 18:10
  • 2
    @RicardoPontual Esse /**ref:5**/ é simplesmente para indicar que o objeto que está ali é o mesmo que está anteriormente em outro ponto (no caso, mais acima, onde tem /**id:5**/). Mas isso não é necessariamente circular, pois a mesma referência para o mesmo objeto pode estar em vários lugares e não dar problema nenhum. Seria circular se o objeto A tem uma referência para B, que por sua vez tem uma referência para A (uma forma de saber se dá problema é tentar converter para JSON). Veja aqui um exemplo: repl.it/@hkotsubo/CircularReferences#index.js
    – hkotsubo
    22/02/2021 às 18:21
  • 2
    E só para constar que eu deixei uma observação no final da minha resposta para chamar a atenção do leitor sobre as cópias que foram (e talvez precisem ser) feitas. cc: @RicardoPontual 22/02/2021 às 18:44
3

Outra alternativa seria indexar cada elemento do array apis pelo seu id e usar cada valor de applications.apis como chave nesse índice.

let apis = [
  {id: "1", name: "api 1"}, 
  {id: "2", name: "api 2"}, 
  {id: "3", name: "api 3"}
];

let applications = [
  {id: "1", name: "application 01", apis: ["1", "2"]}, 
  {id: "2", name: "application 02", apis: ["2", "3"]}
];
   
let index = [];
let result = [];

//Indexa cada elemento de apis pelo seu id.
for(let e of apis){
  index[e.id] = e;  
  //index[e.id] = {...e};  //caso queira criar um objeto novo ao invés de referenciar os objetos já existentes use essa linha. 
}

//Para cada elemento de applications...
for(let e of applications){
  let apis=[]                          //...inicializa a lista que receberá as substituições para esse elemento.
  //...para cada um dos valores em e.apis...
  for(let v of e.apis){
    apis.push(index[v])                //...obtém o elemento indexado pelo valor e salva em apis.
  }
  //Monta o resultado.
  result.push({"id":e["id"],"name":e["name"],"apis":apis})
}

for(var e of result){console.log(e)}

O mesmo código acima em versão funcional.

let apis = [
  {id: "1", name: "api 1"}, 
  {id: "2", name: "api 2"}, 
  {id: "3", name: "api 3"}
];

let applications = [
  {id: "1", name: "application 01", apis: ["1", "2"]}, 
  {id: "2", name: "application 02", apis: ["2", "3"]}
];

let index = apis.reduce((r,e)=>{
  r[e.id]= e;
  //r[e.id] = {...e};  //caso queira criar um objeto novo ao invés de referenciar os objetos já existentes use essa linha.
  return r;
},[]);

let result = applications.reduce((r,e)=>{
  let apis= e.apis.reduce((r,e)=>{
    r.push(index[e]);
    return r
  },[]);   
  r.push({"id":e["id"],"name":e["name"],"apis":apis})
  return r
},[]);    

for(var e of result){console.log(e)}

18
  • 1
    E se os IDs forem espaçados? Aí o array vai ficar esburacado? :P Eu me sempre esqueço dessa técnica de usar o array (que sempre me deixa surpreso porque é muito interessante), mas, nesse caso, não seria melhor utilizar os índices (índice mesmo) de cada elemento do array apis? 22/02/2021 às 14:05
  • 1
    @LuizFelipe O array de índice fica esburacado mesmo. Para falar a verdade ele já começa esburacado, o índice 0 é o primeiro buraco. 22/02/2021 às 14:06
  • 2
    @RicardoPontual, isso não significa referência circular. As referências são as mesmas e, por causa disso, esse é um comportamento esperado (e, novamente, não se trata de comportamento circular). 22/02/2021 às 18:05
  • 2
    Não há dependência cíclica. Faça o seguinte for(var e of result){console.log(e)} e veja por si. Se fizer isso JSON.stringify(result) em um objeto com referencia cíclica o programa trava. 22/02/2021 às 18:13
  • 2
    Não está errado lá. Na pergunta que você linkou realmente há dependência círcular. Só que isso não acontece aqui. Você está estipulando ligações e termos desconexos e que não acontecem aqui. Leia os links referidos em meu outro comentário para entender o que é uma dependência circular e referência circular. 22/02/2021 às 18:15
2

Devido aos inúmeros comentários, para tentar explicar melhor vou redigir uma resposta, se acharem que ajuda fica aqui, senão podemos remover.

Vou pegar por exemplo o código da resposta do @AugustoVasques:

let apis = [
  {id: "1", name: "api 1"}, 
  {id: "2", name: "api 2"}, 
  {id: "3", name: "api 3"}
];

let applications = [
  {id: "1", name: "application 01", apis: ["1", "2"]}, 
  {id: "2", name: "application 02", apis: ["2", "3"]}
];
   
let index = [];
let result = [];

//Indexa cada elemento de apis pelo seu id.
for(let e of apis){
  index[e.id] = e;
}

//Para cada elemento de applications...
for(let e of applications){
  let apis=[]                          //...inicializa a lista que receberá as substituições para esse elemento.
  //...para cada um dos valores em e.apis...
  for(let v of e.apis){
    apis.push(index[v])                //...obtém o elemento indexado pelo valor e salva em apis.
  }
  //Monta o resultado.
  result.push({"id":e["id"],"name":e["name"],"apis":apis})
}

// Aqui, vai apontar a tal "dependencia circular" com /**id:5**/
console.log(result);
/*
Isso indica que, um mesmo objeto tem referência ao mesmo objeto "filho" (nesse caso, "apis") em pontos diferentes. Isso é demonstrado alterando esse objeto com a mesma referência.
Veja que será alterado um elemento, mas ao serializar, TODAS as referências são alteradas.
*/

console.log("Agora vai ser alterado um único objeto:");

result[0].apis[1].name = "bananas";

console.log(JSON.parse(JSON.stringify(result)))

Vejam que, ao alterar um único objeto, todos que tem a mesma referência são alterados. Isso numa linguagem com C# é algo claro de entender, porque objetos tem refências para outros.

Como o @Luiz Felipe comentou, é um nome que não cabe muito bem para isso, mas é assim que tenho lido e é assim que é chamado, por exemplo nesses links:

https://stackoverflow.com/questions/14962018/detecting-and-fixing-circular-references-in-javascript

https://dev.to/salyadav/deep-clone-of-js-objects-with-circular-dependency-4if7

Eu só comentei para alertar para um fato comum e que tem várias perguntas inclusive aqui no SOPt sobre alterar objetos com mesma referência, por exemplo:

var obj1 = new AlgumaClasse();
obj1.Nome = "Batatas";
obj2 = obj1;
obj2.Nome = "Bananas";

// logo, por referência, obj1.Nome também será igual a "Bananas"
13
  • 1
    É justamente essa possibilidade de propagar a alteração em um hotspot que AP procura. Se ele tiver que mudar algum valor on fly ele não precisará procurar quais objetos deverá mudar, apenas altera o valor em apis. 22/02/2021 às 18:27
  • Por exemplo a api aponta para https://minhaapi/func/123?format=json e durante o funcionamento do programa o servidor minhaapi sai do ar e e o AP tem que mudar para mirrorminhaapi então só troca a respectiva entrada no array api para https://mirrorminhaapi/func/123?format=json e alteração é propagada. 22/02/2021 às 18:34
  • 2
    Eu ainda não entendi o problema de manter as referências. Claro, quando se quer evitar mutações, copia-se o valor (como eu fiz na minha resposta quando precisei de modificar algum valor - linhas 3 e 7). No entanto, os objetos de apis não não modificados, então não tem porque copiá-los, uma vez que implicaria em custo de memória adicional desnecessário. Esse comportamento de referências é comum e esperado no JavaScript e é algo que o programador deve se atentar ao trabalhar com objetos (que são passados por referência). 22/02/2021 às 18:38
  • Não vejo problema @LuizFelipe, desde que isso fique claro. O exemplo de código que coloquei na resposta, pode ser um problema para uma pessoa, mas para outra não, pode se exatamente o que ela precisa, mas é importante deixar claro. No exemplo da pergunta, pegamos dois objetos que nada tem de referencia um com outro e geramos um novo novo com referências, é importante mostrar. Se vai fazer diferença ou não, depende de quem vai usar 22/02/2021 às 18:41
  • 1
    exato @AugustoVasques, senão não se consegue validar a referência :) veja que se usar result[0].apis[0].name que não tem referência funciona. O que importa é o resultado final depois do mapping 22/02/2021 às 19:20
0

Você pode utilizar o array map, para mapear seu objeto conforme o modelo que deseja apresentar:

let apis = [
  {id: "1", name: "api 1"}, 
  {id: "2", name: "api 2"}, 
  {id: "3", name: "api 3"}
];

let applications = [
  {id: "1", name: "application 01", apis: ["1", "2"]}, 
  {id: "2", name: "application 02", apis: ["2", "3"]}
];

var collection = [];

 collection[0] = apis.map((val) => {
  return {
     id:val.id,
     name:val.name,
     apis:(val.apis) ? val.apis : []
  }
});

collection[1] = applications.map((val) => {
  return {
     id:val.id,
     name:val.name,
     apis:val.apis
  }
});

console.log(collection)

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .