Looping through an array and appending distinct elements to a fresh array

Question

Looping through an array and appending distinct elements to a fresh array

I am currently facing an issue and seeking feedback on how to resolve it.

Below is the JSON data:

  questions: [
    {
      question: 'lala',
      answer: 'papa',
      categories: ['Handla']

    },
    {
      question: 'xxxx',
      answer: 'yyyy',
      categories: ['Reklamation']
    },
    {
      question: 'abcefg',
      answer: 'gooooogle',
      categories: ['Reklamation']
    }
  ]

My objective is to loop through this question array, extract and append ALL the object.categories to a new array, and then eliminate any duplicate entries. So, the desired output should be:

["Handla", "Reklamation"]

javascript arrays ecmascript-6

Answer 1

Answer №1

The ES6 Set makes it simple to eliminate duplicate values effortlessly. Start by merging all your categories into a single array:

const questions = [
    {
      question: 'lala',
      answer: 'papa',
      categories: ['Handla']

    },
    {
      question: 'xxxx',
      answer: 'yyyy',
      categories: ['Reklamation']
    },
    {
      question: 'abcefg',
      answer: 'gooooogle',
      categories: ['Reklamation']
    }
  ];
const flattened = questions.reduce((prev, curr) => [...prev, ...curr.categories], []); // ['Handla', 'Reklamation', 'Reklamation']
const unique = Array.from(new Set(flattened));
console.log(unique);

Answer 2

The ES6 Set makes it simple to eliminate duplicate values effortlessly. Start by merging all your categories into a single array:

const questions = [
    {
      question: 'lala',
      answer: 'papa',
      categories: ['Handla']

    },
    {
      question: 'xxxx',
      answer: 'yyyy',
      categories: ['Reklamation']
    },
    {
      question: 'abcefg',
      answer: 'gooooogle',
      categories: ['Reklamation']
    }
  ];
const flattened = questions.reduce((prev, curr) => [...prev, ...curr.categories], []); // ['Handla', 'Reklamation', 'Reklamation']
const unique = Array.from(new Set(flattened));
console.log(unique);

Answer 3

Answer №2

To achieve this, one can utilize the map() method along with ES6 Set and spread syntax ...

const data = {"questions":[{"question":"lala","answer":"papa","categories":["Handla"]},{"question":"xxxx","answer":"yyyy","categories":["Reklamation"]},{"question":"abcefg","answer":"gooooogle","categories":["Reklamation"]}]}

const result = [...new Set([].concat(...data.questions.map(o => o.categories)))]
console.log(result)

Alternatively, instead of map(), one can opt for using reduce() and employ Set as the accumulator parameter.

const data = {"questions":[{"question":"lala","answer":"papa","categories":["Handla"]},{"question":"xxxx","answer":"yyyy","categories":["Reklamation"]},{"question":"abcefg","answer":"gooooogle","categories":["Reklamation"]}]}

const result = [...data.questions.reduce((r, e) => {
  return r.add(...e.categories), r
}, new Set)]
console.log(result)

Answer 4

To achieve this, one can utilize the map() method along with ES6 Set and spread syntax ...

const data = {"questions":[{"question":"lala","answer":"papa","categories":["Handla"]},{"question":"xxxx","answer":"yyyy","categories":["Reklamation"]},{"question":"abcefg","answer":"gooooogle","categories":["Reklamation"]}]}

const result = [...new Set([].concat(...data.questions.map(o => o.categories)))]
console.log(result)

Alternatively, instead of map(), one can opt for using reduce() and employ Set as the accumulator parameter.

const data = {"questions":[{"question":"lala","answer":"papa","categories":["Handla"]},{"question":"xxxx","answer":"yyyy","categories":["Reklamation"]},{"question":"abcefg","answer":"gooooogle","categories":["Reklamation"]}]}

const result = [...data.questions.reduce((r, e) => {
  return r.add(...e.categories), r
}, new Set)]
console.log(result)

Answer 5

Answer №3

To accomplish this task efficiently, you can break it down into two simple steps. First, transform the questions into an array containing all categories. Then, filter out the unique items. Here's an example code snippet to help you achieve this:

const data = {
  questions: [{
      question: 'apple',
      answer: 'banana',
      categories: ['Fruit']
    },
    {
      question: 'blue',
      answer: 'green',
      categories: ['Color']
    },
    {
      question: '1',
      answer: '2',
      categories: ['Number']
    }
  ]
}

const categories = data.questions
  .reduce((prev, curr) => prev.concat(curr.categories), [])
  .filter((category, index, array) => array.indexOf(category) === index)

console.log(categories)

Answer 6

To accomplish this task efficiently, you can break it down into two simple steps. First, transform the questions into an array containing all categories. Then, filter out the unique items. Here's an example code snippet to help you achieve this:

const data = {
  questions: [{
      question: 'apple',
      answer: 'banana',
      categories: ['Fruit']
    },
    {
      question: 'blue',
      answer: 'green',
      categories: ['Color']
    },
    {
      question: '1',
      answer: '2',
      categories: ['Number']
    }
  ]
}

const categories = data.questions
  .reduce((prev, curr) => prev.concat(curr.categories), [])
  .filter((category, index, array) => array.indexOf(category) === index)

console.log(categories)

Answer 7

Answer №4

To easily obtain unique values from an array of categories, you can utilize the Set data structure in JavaScript.

var items = [{ item: 'apple', type: 'fruit', categories: ['Healthy'] }, { item: 'banana', type: 'fruit', categories: ['Healthy'] }, { item: 'cake', type: 'dessert', categories: ['Sweet'] }],
    uniqueCategories = [...new Set(items.reduce((result, { categories: category }) => result.concat(category), []))];

console.log(uniqueCategories);

Answer 8

To easily obtain unique values from an array of categories, you can utilize the Set data structure in JavaScript.

var items = [{ item: 'apple', type: 'fruit', categories: ['Healthy'] }, { item: 'banana', type: 'fruit', categories: ['Healthy'] }, { item: 'cake', type: 'dessert', categories: ['Sweet'] }],
    uniqueCategories = [...new Set(items.reduce((result, { categories: category }) => result.concat(category), []))];

console.log(uniqueCategories);

Answer 9

Answer №5

You have the option to utilize plain JavaScript that is compatible with a wider range of browsers

var cats = [], questions = [{question: 'lala',answer: 'papa',categories: ['Handla']},{question: 'xxxx',answer: 'yyyy',categories: ['Reklamation']},{question: 'abcefg',answer: 'gooooogle',categories: ['Reklamation']}];

for (var i = 0; i < questions.length; i++) {
  var cat = questions[i].categories[0];
  if (cats.indexOf(cat) == -1) cats.push(cat);
}
console.log(cats);

A more contemporary approach:

const questions = [{question: 'lala',answer: 'papa',categories: ['Handla']},{question: 'xxxx',answer: 'yyyy',categories: ['Reklamation']},{question: 'abcefg',answer: 'gooooogle',categories: ['Reklamation']}];
let cats = [];

questions.forEach(function(q) {
  var cat = q.categories[0];
  if (cats.indexOf(cat) == -1) cats.push(cat);
});
console.log(cats);

Answer 10

You have the option to utilize plain JavaScript that is compatible with a wider range of browsers

var cats = [], questions = [{question: 'lala',answer: 'papa',categories: ['Handla']},{question: 'xxxx',answer: 'yyyy',categories: ['Reklamation']},{question: 'abcefg',answer: 'gooooogle',categories: ['Reklamation']}];

for (var i = 0; i < questions.length; i++) {
  var cat = questions[i].categories[0];
  if (cats.indexOf(cat) == -1) cats.push(cat);
}
console.log(cats);

A more contemporary approach:

const questions = [{question: 'lala',answer: 'papa',categories: ['Handla']},{question: 'xxxx',answer: 'yyyy',categories: ['Reklamation']},{question: 'abcefg',answer: 'gooooogle',categories: ['Reklamation']}];
let cats = [];

questions.forEach(function(q) {
  var cat = q.categories[0];
  if (cats.indexOf(cat) == -1) cats.push(cat);
});
console.log(cats);

Looping through an array and appending distinct elements to a fresh array

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

Code in JavaScript: Generating Random Number within a Loop

Combining Django with the powerful Vue3 and lightning fast Vite

Javascript animation functioning for a singular item within a list

Issues with APIs surfaced following the transition from DataGridPro to DataGridPremium

What steps are involved in setting up a local server on my computer in order to create an API that can process http requests from Flutter?

What is the best way to tally the number of fields in a JSON file based on their values

Presenting a Random Term from an Array in Dual Locations

Updating the content with HTML and JavaScript

Error in jQuery sortable function occurs when dragging multiple elements

What advantages come from caching the document object for improved performance?

What is the best way to swap out every instance of an array?

Refreshing dynamically added rows through ajax updates

What could be causing the npm mysql module to malfunction when trying to initiate the 'connect()' function in a separate .js file?

using ng-show to display array elements

Can you explain how the functionality of setState operates within React in this specific situation?

The array formations are validated and confirmed

Implement lazy loading functionality in Django to dynamically load data as the user scrolls

Express JS res.send() with an array response data is posing a concern during the Checkmarx scan

Tips for optimizing AngularJS performance with large scopes

Is there a way to segment a string into words using a dictionary and finding the longest match in JS/Jquery?