Tips for utilizing the method array.from and new set to efficiently return multiple values

Question

Tips for utilizing the method array.from and new set to efficiently return multiple values

Is it possible to extract numerous unique values from an array of objects using the Array.from(new Set) method?

For instance:

   this.data = [
  {
    "_id": "5bf57b965401169dd81c2a51",
    "age": 35,
    "name": "Paige Zamora",
    "gender": "female",
    "company": "AUTOMON",
    "reference_id": "12"
  },
  {
    "_id": "5bf57b96c2c3b88adff4b972",
    "age": 40,
    "name": "Jennifer Carr",
    "gender": "female",
    "company": "SYNKGEN",
    "reference_id": "11"
  },
  {
    "_id": "5bf57b969dd839926db78767",
    "age": 38,
    "name": "Weaver Rosales",
    "gender": "male",
    "company": "ETERNIS",
    "reference_id": "10"
  },
  {
    "_id": "5bf57b968c845ea691e76c84",
    "age": 31,
    "name": "Myers Pickett",
    "gender": "male",
    "company": "ETERNIS",
    "reference_id": "10"
  },
  {
    "_id": "5bf57b96998c44eff083d3fa",
    "age": 36,
    "name": "Dona Nicholson",
    "gender": "female",
    "company": "ETERNIS",
    "reference_id": "10"
  }
]

I want to retrieve the unique values for: reference_id and the corresponding company, resulting in:

[{12, AUTOMON}, {11, SYNKGEN}, {10, ETERNIS}]

I had considered using this approach:

const list = Array.from(new Set(this.data.map(({reference_id}) => reference_id)));

which returns:

[12, 11, 10]

Can this method be adapted to return multiple values like the list provided above?

javascript arrays typescript

Answer 1

Answer №1

To extract the desired data, consider utilizing a JSON format and then extracting the parsed values as output.

One might wonder why use a string instead of an object. The issue arises when creating new objects with similar properties; each new object is distinct rather than identical.

Set operates on either a single primitive or object and verifies if an object's reference matches. By employing a string, it enables checking the value and obtaining unique strings within the set. To achieve this, the JSON must be converted back into an object.

var data = [{ _id: "5bf57b965401169dd81c2a51", age: 35, name: "Paige Zamora", gender: "female", company: "AUTOMON", reference_id: "12" }, { _id: "5bf57b96c2c3b88adff4b972", age: 40, name: "Jennifer Carr", gender: "female", company: "SYNKGEN", reference_id: "11" }, { _id: "5bf57b969dd839926db78767", age: 38, name: "Weaver Rosales", gender: "male", company: "ETERNIS", reference_id: "10" }, { _id: "5bf57b968c845ea691e76c84", age: 31, name: "Myers Pickett", gender: "male", company: "ETERNIS", reference_id: "10" }, { _id: "5bf57b96998c44eff083d3fa", age: 36, name: "Dona Nicholson", gender: "female", company: "ETERNIS", reference_id: "10" }],
    unique = Array.from(
        new Set(
            data.map(({ reference_id, company }) =>
                JSON.stringify({ reference_id, company }))
        ),
        json => JSON.parse(json)
    );
    
console.log(unique);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

To extract the desired data, consider utilizing a JSON format and then extracting the parsed values as output.

One might wonder why use a string instead of an object. The issue arises when creating new objects with similar properties; each new object is distinct rather than identical.

Set operates on either a single primitive or object and verifies if an object's reference matches. By employing a string, it enables checking the value and obtaining unique strings within the set. To achieve this, the JSON must be converted back into an object.

var data = [{ _id: "5bf57b965401169dd81c2a51", age: 35, name: "Paige Zamora", gender: "female", company: "AUTOMON", reference_id: "12" }, { _id: "5bf57b96c2c3b88adff4b972", age: 40, name: "Jennifer Carr", gender: "female", company: "SYNKGEN", reference_id: "11" }, { _id: "5bf57b969dd839926db78767", age: 38, name: "Weaver Rosales", gender: "male", company: "ETERNIS", reference_id: "10" }, { _id: "5bf57b968c845ea691e76c84", age: 31, name: "Myers Pickett", gender: "male", company: "ETERNIS", reference_id: "10" }, { _id: "5bf57b96998c44eff083d3fa", age: 36, name: "Dona Nicholson", gender: "female", company: "ETERNIS", reference_id: "10" }],
    unique = Array.from(
        new Set(
            data.map(({ reference_id, company }) =>
                JSON.stringify({ reference_id, company }))
        ),
        json => JSON.parse(json)
    );
    
console.log(unique);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

To group them in a Map without repetitions, create an array based on the string representations of reference_id and company:

var data = [{
    "_id": "5bf57b965401169dd81c2a51",
    "age": 35,
    "name": "Paige Zamora",
    "gender": "female",
    "company": "AUTOMON",
    "reference_id": "12"
  },
  {
    "_id": "5bf57b96c2c3b88adff4b972",
    "age": 40,
    "name": "Jennifer Carr",
    "gender": "female",
    "company": "SYNKGEN",
    "reference_id": "11"
  },
  {
    "_id": "5bf57b969dd839926db78767",
    "age": 38,
    "name": "Weaver Rosales",
    "gender": "male",
    "company": "ETERNIS",
    "reference_id": "10"
  },
  {
    "_id": "5bf57b968c845ea691e76c84",
    "age": 31,
    "name": "Myers Pickett",
    "gender": "male",
    "company": "ETERNIS",
    "reference_id": "10"
  },
  {
    "_id": "5bf57b96998c44eff083d3fa",
    "age": 36,
    "name": "Dona Nicholson",
    "gender": "female",
    "company": "ETERNIS",
    "reference_id": "10"
  }
];


var result = Array.from(data.reduce((accumulator, {reference_id, company}) => {
  accumulator.set(`${reference_id},${company}`, {reference_id, company});
  return accumulator;
}, new Map()).values());

console.log(result);

Answer 4

To group them in a Map without repetitions, create an array based on the string representations of reference_id and company:

var data = [{
    "_id": "5bf57b965401169dd81c2a51",
    "age": 35,
    "name": "Paige Zamora",
    "gender": "female",
    "company": "AUTOMON",
    "reference_id": "12"
  },
  {
    "_id": "5bf57b96c2c3b88adff4b972",
    "age": 40,
    "name": "Jennifer Carr",
    "gender": "female",
    "company": "SYNKGEN",
    "reference_id": "11"
  },
  {
    "_id": "5bf57b969dd839926db78767",
    "age": 38,
    "name": "Weaver Rosales",
    "gender": "male",
    "company": "ETERNIS",
    "reference_id": "10"
  },
  {
    "_id": "5bf57b968c845ea691e76c84",
    "age": 31,
    "name": "Myers Pickett",
    "gender": "male",
    "company": "ETERNIS",
    "reference_id": "10"
  },
  {
    "_id": "5bf57b96998c44eff083d3fa",
    "age": 36,
    "name": "Dona Nicholson",
    "gender": "female",
    "company": "ETERNIS",
    "reference_id": "10"
  }
];


var result = Array.from(data.reduce((accumulator, {reference_id, company}) => {
  accumulator.set(`${reference_id},${company}`, {reference_id, company});
  return accumulator;
}, new Map()).values());

console.log(result);

Answer 5

Answer №3

Give this a go:

this.data.map((el) =>{ return {age: el.age, company: el.company} })

// The resulting array will be:
//0: {age: 35, company: "AUTOMON"}
//1: {age: 40, company: "SYNKGEN"}
//2: {age: 38, company: "ETERNIS"}
//3: {age: 31, company: "ETERNIS"}
//4: {age: 36, company: "ETERNIS"}

{12, AUTOMON} doesn't make sense, object should be formatted as { key: value, key: value...}

Answer 6

Give this a go:

this.data.map((el) =>{ return {age: el.age, company: el.company} })

// The resulting array will be:
//0: {age: 35, company: "AUTOMON"}
//1: {age: 40, company: "SYNKGEN"}
//2: {age: 38, company: "ETERNIS"}
//3: {age: 31, company: "ETERNIS"}
//4: {age: 36, company: "ETERNIS"}

{12, AUTOMON} doesn't make sense, object should be formatted as { key: value, key: value...}

Tips for utilizing the method array.from and new set to efficiently return multiple values

Answer №1

Answer №2

Answer №3

Similar questions

When incorporating ng-include, the flash game graphic will have a tail, but it will be absent when not using

Array input for CodeIgniter

The bootstrap switch button remains in a neutral grey color

Why am I encountering an "Uncaught TypeError: Cannot read property 'value' of null" Error while trying to authenticate via Email?

What is the process for iterating through two array lists in Firestore and retrieving both the number of matched items and the matched items themselves?

Tips for arranging an array of FileInfo objects from largest to smallest without using LINQ

Updating and showing a variable in a PHP file using JavaScript within an HTML webpage

Utilizing the zIndex property in webGL programming

Trigger a JQuery dialog after submitting a form in MVC and pause execution until a user responds

Step-by-step guide on dynamically adding "Input Tags" to the DOM at runtime using Selenium's JavascriptExecutor

Upon utilizing ComponentDidMount(), a peculiar error surfaced: "Unable to invoke setState."

The React.js navigation bar hamburger menu refuses to close when toggled

Exploring the parent scope in handlebars.js partials

How can I display a calendar with a complete month view using ng-repeat?

The datetime-picker from Twitter Bootstrap is not accurately displayed within a modal

Constructing items within an array literal using a constructor method

What is the best way to eliminate excess elements from overflow:hidden?

When submitting the form for the zip code input, use an XMLHttpRequest to input the zip code and retrieve the corresponding city

Looking to showcase initial API data upon page load without requiring any user input?

Retrieving a Date object from a JSON response