Create a new array from two existing arrays filtering by id with Javascript

Question

I have this situation. Two arrays, Questions and Options. Is there any way to create a new array, with a new item Options with all options that contains id_question = 1 with Javascript? I tried with find() but it returns only one option, not four. Examples below:

 const questions = [{
     "id": 1,
     "image": "96335de36bec-viagem1.png",
     "title": "Quantas viagens você costuma fazer por ano?"
   },
   {
     "id": 2,
     "image": "b3f2d639f6fd-aviao2.png",
     "title": "Qual foi o destino de sua última viagem?"
   },
   {
     "id": 3,
     "image": "53125381aec5-praia1.png",
     "title": "Qual tipo de clima você deseja para sua próxima viagem?"
   },
   {
     "id": 4,
     "image": "1a9c51a4dd84-aviaopessoa.png",
     "title": "Você planeja viajar para fora do Brasil?"
   }
 ]

 const options = [{
     id: 1,
     id_question: 1,
     value: '1',
     description: 'Uma vez ao ano'
   },
   {
     id: 2,
     id_question: 1,
     value: '3',
     description: 'Até 3 vezes ao ano'
   },
   {
     id: 3,
     id_question: 1,
     value: '6',
     description: 'Até 6 vezes ao ano'
   },
   {
     id: 4,
     id_question: 1,
     value: '12',
     description: 'Pelo menos uma vez a cada mês'
   },
   {
     id: 5,
     id_question: 2,
     value: 'NORTE_NORDESTE',
     description: 'Região Norte/Nordeste do Brasil'
   },
   {
     id: 6,
     id_question: 2,
     value: 'SUL_SUDESTE',
     description: 'Região Sul/Sudeste do Brasil'
   },
   {
     id: 7,
     id_question: 2,
     value: 'CENTRO',
     description: 'Região Central do Brasil'
   },
   {
     id: 8,
     id_question: 2,
     value: 'VIAJOU_FORA',
     description: 'Para fora do Brasil'
   }
 ]

I want the new Array with the objects like this

{
  "question": {
    "id": 1,
    "image": "96335de36bec-viagem1.png",
    "title": "Quantas viagens você costuma fazer por ano?",
  },
  "options": [{
      "id": 1,
      "id_question": 1,
      "value": "1",
      "description": "Uma vez ao ano"
    },
    {
      "id": 2,
      "id_question": 1,
      "value": "3",
      "description": "Até 3 vezes ao ano"
    },
    {
      "id": 3,
      "id_question": 1,
      "value": "6",
      "description": "Até 6 vezes ao ano"
    },
    {
      "id": 4,
      "id_question": 1,
      "value": "12",
      "description": "Pelo menos uma vez a cada mês"
    }
  ]
}

Sushanth -- · Accepted Answer · 2020-06-11 18:06:36Z

2

find short circuits once it satisfies the condition. You can use filter instead which iterates over the entire array and returns the entities that satisfy the condition.

const optionsForQuestion = options.filter(option => {
   return option.id_question === question.id;
});

answered Jun 11, 2020 at 18:06

Sushanth --

55.8k9 gold badges70 silver badges109 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ashik Paul · Accepted Answer · 2020-06-11 18:19:47Z

Let me know if this is what you were expecting. This creates for all the questions.

Hope this helps

questions = [
  {
    "id": 1,
    "image": "96335de36bec-viagem1.png",
    "title": "Quantas viagens você costuma fazer por ano?"
  },
  {
    "id": 2,
    "image": "b3f2d639f6fd-aviao2.png",
    "title": "Qual foi o destino de sua última viagem?"
  },
  {
    "id": 3,
    "image": "53125381aec5-praia1.png",
    "title": "Qual tipo de clima você deseja para sua próxima viagem?"
  },
  {
    "id": 4,
    "image": "1a9c51a4dd84-aviaopessoa.png",
    "title": "Você planeja viajar para fora do Brasil?"
  }
]

options = [
      { 
        id: 1, 
        id_question: 1, 
        value: '1', 
        description: 'Uma vez ao ano' 
      },
      {
        id: 2,
        id_question: 1,
        value: '3',
        description: 'Até 3 vezes ao ano'
      },
      {
        id: 3,
        id_question: 1,
        value: '6',
        description: 'Até 6 vezes ao ano'
      },
      {
        id: 4,
        id_question: 1,
        value: '12',
        description: 'Pelo menos uma vez a cada mês'
      },
      {
        id: 5,
        id_question: 2,
        value: 'NORTE_NORDESTE',
        description: 'Região Norte/Nordeste do Brasil'
      },
      {
        id: 6,
        id_question: 2,
        value: 'SUL_SUDESTE',
        description: 'Região Sul/Sudeste do Brasil'
      },
      {
        id: 7,
        id_question: 2,
        value: 'CENTRO',
        description: 'Região Central do Brasil'
      },
      {
        id: 8,
        id_question: 2,
        value: 'VIAJOU_FORA',
        description: 'Para fora do Brasil'
      }
    ]

var questions = [
  {
    "id": 1,
    "image": "96335de36bec-viagem1.png",
    "title": "Quantas viagens você costuma fazer por ano?"
  },
  {
    "id": 2,
    "image": "b3f2d639f6fd-aviao2.png",
    "title": "Qual foi o destino de sua última viagem?"
  },
  {
    "id": 3,
    "image": "53125381aec5-praia1.png",
    "title": "Qual tipo de clima você deseja para sua próxima viagem?"
  },
  {
    "id": 4,
    "image": "1a9c51a4dd84-aviaopessoa.png",
    "title": "Você planeja viajar para fora do Brasil?"
  }
]

var options = [
      { 
        id: 1, 
        id_question: 1, 
        value: '1', 
        description: 'Uma vez ao ano' 
      },
      {
        id: 2,
        id_question: 1,
        value: '3',
        description: 'Até 3 vezes ao ano'
      },
      {
        id: 3,
        id_question: 1,
        value: '6',
        description: 'Até 6 vezes ao ano'
      },
      {
        id: 4,
        id_question: 1,
        value: '12',
        description: 'Pelo menos uma vez a cada mês'
      },
      {
        id: 5,
        id_question: 2,
        value: 'NORTE_NORDESTE',
        description: 'Região Norte/Nordeste do Brasil'
      },
      {
        id: 6,
        id_question: 2,
        value: 'SUL_SUDESTE',
        description: 'Região Sul/Sudeste do Brasil'
      },
      {
        id: 7,
        id_question: 2,
        value: 'CENTRO',
        description: 'Região Central do Brasil'
      },
      {
        id: 8,
        id_question: 2,
        value: 'VIAJOU_FORA',
        description: 'Para fora do Brasil'
      }
    ]

console.log(questions.map((q)=>{
  return {"questions" : q, "options" : options.filter((o)=>{
    if( q.id == o.id_question )
     return o
  })}
}));

Mario · Accepted Answer · 2020-06-11 18:19:11Z

Please try the following solution

const questions = [
  {
    id: 1,
    image: "96335de36bec-viagem1.png",
    title: "Quantas viagens você costuma fazer por ano?",
  },
  {
    id: 2,
    image: "b3f2d639f6fd-aviao2.png",
    title: "Qual foi o destino de sua última viagem?",
  },
  {
    id: 3,
    image: "53125381aec5-praia1.png",
    title: "Qual tipo de clima você deseja para sua próxima viagem?",
  },
  {
    id: 4,
    image: "1a9c51a4dd84-aviaopessoa.png",
    title: "Você planeja viajar para fora do Brasil?",
  },
];

const options = [
  {
    id: 1,
    id_question: 1,
    value: "1",
    description: "Uma vez ao ano",
  },
  {
    id: 2,
    id_question: 1,
    value: "3",
    description: "Até 3 vezes ao ano",
  },
  {
    id: 3,
    id_question: 1,
    value: "6",
    description: "Até 6 vezes ao ano",
  },
  {
    id: 4,
    id_question: 1,
    value: "12",
    description: "Pelo menos uma vez a cada mês",
  },
  {
    id: 5,
    id_question: 2,
    value: "NORTE_NORDESTE",
    description: "Região Norte/Nordeste do Brasil",
  },
  {
    id: 6,
    id_question: 2,
    value: "SUL_SUDESTE",
    description: "Região Sul/Sudeste do Brasil",
  },
  {
    id: 7,
    id_question: 2,
    value: "CENTRO",
    description: "Região Central do Brasil",
  },
  {
    id: 8,
    id_question: 2,
    value: "VIAJOU_FORA",
    description: "Para fora do Brasil",
  },
];

const output = questions.map((question) => {
  const result = options.filter((option) => option.id_question === question.id);

  return {
    ...question,
    options: JSON.stringify(result),
  };
});

console.log(output);

AyushKatiyar · Accepted Answer · 2020-06-11 18:23:39Z

Try using:

questions = [
     {
       "id": 1,
       "image": "96335de36bec-viagem1.png",
       "title": "Quantas viagens você costuma fazer por ano?"
     },
     {
       "id": 2,
       "image": "b3f2d639f6fd-aviao2.png",
       "title": "Qual foi o destino de sua última viagem?"
     },
     {
       "id": 3,
       "image": "53125381aec5-praia1.png",
       "title": "Qual tipo de clima você deseja para sua próxima viagem?"
     },
     {
       "id": 4,
       "image": "1a9c51a4dd84-aviaopessoa.png",
       "title": "Você planeja viajar para fora do Brasil?"
     }
   ]

   options = [
         { 
           id: 1, 
           id_question: 1, 
           value: '1', 
           description: 'Uma vez ao ano' 
         },
         {
           id: 2,
           id_question: 1,
           value: '3',
           description: 'Até 3 vezes ao ano'
         },
         {
           id: 3,
           id_question: 1,
           value: '6',
           description: 'Até 6 vezes ao ano'
         },
         {
           id: 4,
           id_question: 1,
           value: '12',
           description: 'Pelo menos uma vez a cada mês'
         },
         {
           id: 5,
           id_question: 2,
           value: 'NORTE_NORDESTE',
           description: 'Região Norte/Nordeste do Brasil'
         },
         {
           id: 6,
           id_question: 2,
           value: 'SUL_SUDESTE',
           description: 'Região Sul/Sudeste do Brasil'
         },
         {
           id: 7,
           id_question: 2,
           value: 'CENTRO',
           description: 'Região Central do Brasil'
         },
         {
           id: 8,
           id_question: 2,
           value: 'VIAJOU_FORA',
           description: 'Para fora do Brasil'
         }
       ]
var res = []
questions.forEach(q => {
     let option = options.filter((elem)=>{if(elem.id_question === q.id){ return true;}})
     console.log(options)
     res.push({
          'question': q,
          "options": JSON.parse(JSON.stringify(option))
     })
});

console.log(res)

Hope this helps.

Arun Kumar · Accepted Answer · 2020-06-11 18:39:41Z

1

var newArray = [];
for(let i=0; i<questions.length; i++) {
    newArray.push({
        question: questions[i],
        options: options.filter(option => option.id_question === questions[i].id)
    });
}

Array.prototype.find() - returns the value of the first element in the provided array

Array.prototype.filter() - creates a new array with all elements that pass the test.

answered Jun 11, 2020 at 18:39

Arun Kumar

495 bronze badges

Collectives™ on Stack Overflow

Create a new array from two existing arrays filtering by id with Javascript

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related