Sort through an array of objects by a specific field in each object

Question

Sort through an array of objects by a specific field in each object

Imagine having an array containing different objects:

[
  { "category": 121, "item": "item1" },
  { "category": 128, "item": "item2" },
  { "category": 130, "item": "item2" },
  { "category": 130, "item": "item2" }
]

Your goal is to filter this array and generate new objects based on the item field.

The desired outcome should look like this:

[
  { "category": 121, "item": "item1" }
]

[
  { "category": 128, "item": "item2" },
  { "category": 130, "item": "item2" },
  { "category": 130, "item": "item2" }
]

In order to achieve this task efficiently, I recommend using typescript and lodash. Although attempts with lodash groupBy and ES6 mapping were made previously, they did not yield successful results. Perhaps a cleaner solution involving smart usage of loop functions could provide an easier way to accomplish this objective.

angular typescript object ecmascript-6 lodash

Answer 1

Answer №1

To filter the array based on a specific condition, you can utilize the .filter method. See below for an example:

let filteredArray1 = array.filter(item => item.type === 'type1');
let filteredArray2 = array.filter(item => item.type === 'type2');
...

Answer 2

To filter the array based on a specific condition, you can utilize the .filter method. See below for an example:

let filteredArray1 = array.filter(item => item.type === 'type1');
let filteredArray2 = array.filter(item => item.type === 'type2');
...

Answer 3

Answer №2

To filter out an array to a new array object, you can use the Array.filter function. In this example, I have defined a variable called searchModels which contains a list of models that you want to filter. Within the filter function, the condition searchModels.indexOf(item.model) is used to check the model value.

var array = [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 130, "model": "model2" }
];


var searchModels = ['model1', 'model3'];
var filteredArray = array.filter((item) => { return searchModels.indexOf(item.model) !== -1 });
console.log("Original: ", array);
console.log("Filtered: ", filteredArray);

Answer 4

To filter out an array to a new array object, you can use the Array.filter function. In this example, I have defined a variable called searchModels which contains a list of models that you want to filter. Within the filter function, the condition searchModels.indexOf(item.model) is used to check the model value.

var array = [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 130, "model": "model2" }
];


var searchModels = ['model1', 'model3'];
var filteredArray = array.filter((item) => { return searchModels.indexOf(item.model) !== -1 });
console.log("Original: ", array);
console.log("Filtered: ", filteredArray);

Answer 5

Answer №3

One way to achieve this is by creating a Map for easier searching purposes. Let's say we start with some original data and map it accordingly:

var newData = new Map([]);

var originalData = [{"category": 10, "name": "item1"}, {"category": 10, "name": "item2"}];
var formattedData = originalData.map(obj => { 
  newData[obj.name].push(obj.category); 
});

This will result in a structure like this:

newData = ([
    [ "item1", "10" ],
    [ "item1", "10" ],
    [ "item2", "7" ]
]);

Now, you can easily retrieve values based on the model key such as newData["item2"] = ["7"]

Answer 6

One way to achieve this is by creating a Map for easier searching purposes. Let's say we start with some original data and map it accordingly:

var newData = new Map([]);

var originalData = [{"category": 10, "name": "item1"}, {"category": 10, "name": "item2"}];
var formattedData = originalData.map(obj => { 
  newData[obj.name].push(obj.category); 
});

This will result in a structure like this:

newData = ([
    [ "item1", "10" ],
    [ "item1", "10" ],
    [ "item2", "7" ]
]);

Now, you can easily retrieve values based on the model key such as newData["item2"] = ["7"]

Answer 7

Answer №4

To group all items together, one can utilize the Array.prototype.reduce method.

let array = [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 130, "model": "model2" }
]

let all = [...array.reduce((acc, curr) => {
  acc.has(curr.model) ? acc.set(curr.model, [...acc.get(curr.model), curr]): acc.set(curr.model, [curr]);
  return acc;
}, new Map()).values()];
console.log(...all)

Answer 8

To group all items together, one can utilize the Array.prototype.reduce method.

let array = [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 130, "model": "model2" }
]

let all = [...array.reduce((acc, curr) => {
  acc.has(curr.model) ? acc.set(curr.model, [...acc.get(curr.model), curr]): acc.set(curr.model, [curr]);
  return acc;
}, new Map()).values()];
console.log(...all)

Answer 9

Answer №5

Hey @raulicious, check out this code snippet:

var arrayList= [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 131, "model": "model2" }
];
   var filteredArray = [];
   var filtered = [];
   
   arrayList.sort((a, b) => {
         if(a.model == b.model) {
             filtered.push(b);
         } else {
             filtered.push(b);
             filteredArray.push(filtered);
             filtered = [];
           }
       filtered.push(a);
       filteredArray.push(filtered);
     });
    console.log(filteredArray);

I'm aware that there is some redundant code here, but I plan to refactor it soon.

Answer 10

Hey @raulicious, check out this code snippet:

var arrayList= [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 131, "model": "model2" }
];
   var filteredArray = [];
   var filtered = [];
   
   arrayList.sort((a, b) => {
         if(a.model == b.model) {
             filtered.push(b);
         } else {
             filtered.push(b);
             filteredArray.push(filtered);
             filtered = [];
           }
       filtered.push(a);
       filteredArray.push(filtered);
     });
    console.log(filteredArray);

I'm aware that there is some redundant code here, but I plan to refactor it soon.

Answer 11

Answer №6

Check out how lodash can assist you

var data = [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 130, "model": "model2" }
];

var grouped = _.groupBy(data, function(item) {
  return item.model;
});

console.log(grouped);

<script src='https://cdn.jsdelivr.net/lodash/4.17.2/lodash.min.js'></script>

Answer 12

Check out how lodash can assist you

var data = [
  { "type": 121, "model": "model1" },
  { "type": 128, "model": "model2" },
  { "type": 130, "model": "model2" },
  { "type": 130, "model": "model2" }
];

var grouped = _.groupBy(data, function(item) {
  return item.model;
});

console.log(grouped);

<script src='https://cdn.jsdelivr.net/lodash/4.17.2/lodash.min.js'></script>

Sort through an array of objects by a specific field in each object

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Answer №6

Similar questions

"Encountered a problem while attempting to download the .xlsx file through http.get in an angular application interfacing

NestJS Ensures Type Safety for Mongoose Models, but Model Functions Expecting Incorrect Types (Any)

Merge type guard declarations

Opting in to an Observable depending on specific criteria

The properties required for type 'Subscription' are not present

Incorporating a class element within an Angular 2 directive

Showing information from Flask API utilizing Angular with underscores

Is it possible to use ngFor with an object instead of an array?

Error in TypeScript not being caught in React due to incorrect type detection

Utilize mapping to object and preserve type inference

When using ngStyle to bind a variable, the binding variable will be null

The post method is functioning properly in browsers such as Firefox, Internet Explorer, and Chrome; however, it is not working in the Edge browser

Angulating Service Testing

Typescript: defining an interface that inherits properties from a JSON type

Troubleshooting Authorization Header Issue in Angular 5

Steps for configuring Types in Graphql Codegen

Angular2 route-driven themes

Steps for adjusting the status of an interface key to required or optional in a dynamic manner

Refresh the table following deletion of a row from firebase

Integrating jquery into an angular project