What is the best way to categorize elements in an array of objects with varying sizes based on two distinct properties in JavaScript?

Question

What is the best way to categorize elements in an array of objects with varying sizes based on two distinct properties in JavaScript?

I am faced with a scenario where I have two distinct arrays of objects obtained from an aggregate function due to using two different collections.

Although I attempted to utilize the map function as outlined here, it proved unsuccessful in resolving my issue. What other strategies can I employ to achieve the desired outcome?

  qrySearch = [{
    sName: 'SomePlace1',
    lBusinessID: 37343,
    SystemID: 5000152
  },
  {
    sName: 'SomePlace2',
    lBusinessID: 39780,
    SystemID: 5000156
  },
  {
    sName: 'SomePlace3',
    lBusinessID: 50772,
    SystemID: 5000519
  },
  {
    sName: 'SomePlace4',
    lBusinessID: 31079,
    SystemID: 5000384
  }
]

and

qrySearchLocID = [{
    LocalLabID: '123f',
    _ID: 'SomePlace1',
    AppLabID: 3,
    count: 15   
  },
  {
    LocalLabID: '12BC',
    _ID: 'SomePlace2',
    AppLabID: 3,
    count: 40
  }
];

After attempting the result extraction, only this array is obtained:

qrySearch = [{
    sName: 'SomePlace1',
    lBusinessID: 37343,
    SystemID: 5000152
  },
  {
    sName: 'SomePlace2',
    lBusinessID: 39780,
    SystemID: 5000156
  },
  {
    sName: 'SomePlace3',
    lBusinessID: 50772,
    SystemID: 5000519
  },
  {
    sName: 'SomePlace4',
    lBusinessID: 31079,
    SystemID: 5000384
  },
]

To simplify matters, the array has been kept brief. The main requirement is to cross-reference the _ID if it corresponds to sName for the desired outcome:

result = [{
        sName: 'SomePlace1',
        lBusinessID: 37343,
        SystemID: 5000152,
        LocalLabID: '123f',
        AppLabID: 3,
        count: 15
      },
      {
        sName: 'SomePlace2',
        lBusinessID: 39780,
        SystemID: 5000156,
        LocalLabID: '12BC',
        AppLabID: 3,
        count: 40
      },
      {
        sName: 'SomePlace3',
        lBusinessID: 50772,
        SystemID: 5000519
      },
      {
        sName: 'SomePlace4',
        lBusinessID: 31079,
        SystemID: 5000384
      }
    ]

Even though I experimented with this approach:

var result = qrySearch.map((e, _) => 
          (_ = qrySearchLocID.find((q) => q._ID=== e.sName)) ? 
          { ...e, ...{ _ID: _._ID} } : e);

The outcome lacked the count information.

javascript mongodb typescript lodash

Answer 1

Answer №1

To effectively combine the values, simply spread your placeholder _

const searchQueries = [
    {
        placeName: 'Location1',
        businessID: 37343,
        ID: 5000152
    },
    {
        placeName: 'Location2',
        businessID: 39780,
        ID: 5000156
    },
    {
        placeName: 'Location3',
        businessID: 50772,
        ID: 5000519
    },
    {
        placeName: 'Location4',
        businessID: 31079,
        ID: 5000384
    },
];

const searchLocQueries = [
    {
        LabID: '123f',
        _ID: 'Location1',
        AppLabID: 3,
        count: 15
    },
    {
        LabID: '12BC',
        _ID: 'Location2',
        AppLabID: 3,
        count: 40
    },
];

var result = searchQueries.map((element, index) =>
          (index = searchLocQueries.find((query) => query._ID === element.placeName)) ?
          { ...element, ...index }: element);
console.log(result);

Answer 2

To effectively combine the values, simply spread your placeholder _

const searchQueries = [
    {
        placeName: 'Location1',
        businessID: 37343,
        ID: 5000152
    },
    {
        placeName: 'Location2',
        businessID: 39780,
        ID: 5000156
    },
    {
        placeName: 'Location3',
        businessID: 50772,
        ID: 5000519
    },
    {
        placeName: 'Location4',
        businessID: 31079,
        ID: 5000384
    },
];

const searchLocQueries = [
    {
        LabID: '123f',
        _ID: 'Location1',
        AppLabID: 3,
        count: 15
    },
    {
        LabID: '12BC',
        _ID: 'Location2',
        AppLabID: 3,
        count: 40
    },
];

var result = searchQueries.map((element, index) =>
          (index = searchLocQueries.find((query) => query._ID === element.placeName)) ?
          { ...element, ...index }: element);
console.log(result);

Answer 3

Answer №2

Develop a process that combines two arrays, organizes them by the sName or _ID, and then maps all groups into a new merged object:

const { flow, concat, groupBy, map, merge, partialRight: pr } = _;

const combine = flow(
  concat,
  pr(groupBy, obj => obj.sName || obj._ID),
  pr(map, group => merge({}, ...group))
);

const qrySearch = [{"sName":"SomePlace1","lBusinessID":37343,"SystemID":5000152},{"sName":"SomePlace2","lBusinessID":39780,"SystemID":5000156},{"sName":"SomePlace3","lBusinessID":50772,"SystemID":5000519},{"sName":"SomePlace4","lBusinessID":31079,"SystemID":5000384}];

const qrySearchLocID = [{"LocalLabID":"123f","_ID":"SomePlace1","AppLabID":3,"count":15},{"LocalLabID":"12BC","_ID":"SomePlace2","AppLabID":3,"count":40}];

const result = combine(qrySearch, qrySearchLocID);

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>

Implementing the same concept using lodash/fp:

const { flow, concat, groupBy, map, mergeAll, propOr } = _;

const combine = flow(
  concat,
  groupBy(obj => obj.sName || obj._ID),
  map(mergeAll)
);

const qrySearch = [{"sName":"SomePlace1","lBusinessID":37343,"SystemID":5000152},{"sName":"SomePlace2","lBusinessID":39780,"SystemID":5000156},{"sName":"SomePlace3","lBusinessID":50772,"SystemID":5000519},{"sName":"SomePlace4","lBusinessID":31079,"SystemID":5000384}];

const qrySearchLocID = [{"LocalLabID":"123f","_ID":"SomePlace1","AppLabID":3,"count":15},{"LocalLabID":"12BC","_ID":"SomePlace2","AppLabID":3,"count":40}];

const result = combine(qrySearch, qrySearchLocID);

console.log(result);

<script src='https://cdn.jsdelivr.net/g/lodash@4(lodash.min.js+lodash.fp.min.js)'></script>

Answer 4

Develop a process that combines two arrays, organizes them by the sName or _ID, and then maps all groups into a new merged object:

const { flow, concat, groupBy, map, merge, partialRight: pr } = _;

const combine = flow(
  concat,
  pr(groupBy, obj => obj.sName || obj._ID),
  pr(map, group => merge({}, ...group))
);

const qrySearch = [{"sName":"SomePlace1","lBusinessID":37343,"SystemID":5000152},{"sName":"SomePlace2","lBusinessID":39780,"SystemID":5000156},{"sName":"SomePlace3","lBusinessID":50772,"SystemID":5000519},{"sName":"SomePlace4","lBusinessID":31079,"SystemID":5000384}];

const qrySearchLocID = [{"LocalLabID":"123f","_ID":"SomePlace1","AppLabID":3,"count":15},{"LocalLabID":"12BC","_ID":"SomePlace2","AppLabID":3,"count":40}];

const result = combine(qrySearch, qrySearchLocID);

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>

Implementing the same concept using lodash/fp:

const { flow, concat, groupBy, map, mergeAll, propOr } = _;

const combine = flow(
  concat,
  groupBy(obj => obj.sName || obj._ID),
  map(mergeAll)
);

const qrySearch = [{"sName":"SomePlace1","lBusinessID":37343,"SystemID":5000152},{"sName":"SomePlace2","lBusinessID":39780,"SystemID":5000156},{"sName":"SomePlace3","lBusinessID":50772,"SystemID":5000519},{"sName":"SomePlace4","lBusinessID":31079,"SystemID":5000384}];

const qrySearchLocID = [{"LocalLabID":"123f","_ID":"SomePlace1","AppLabID":3,"count":15},{"LocalLabID":"12BC","_ID":"SomePlace2","AppLabID":3,"count":40}];

const result = combine(qrySearch, qrySearchLocID);

console.log(result);

<script src='https://cdn.jsdelivr.net/g/lodash@4(lodash.min.js+lodash.fp.min.js)'></script>

What is the best way to categorize elements in an array of objects with varying sizes based on two distinct properties in JavaScript?

Answer №1

Answer №2

Similar questions

Using the input method in JavaScript cannot extract an object property

`How can I enable the download attribute feature on Safari browser?`

populating a multi-dimensional array using a "for" loop in Javascript

Is there a way to instantly show the contents of a newly opened tab in BootstrapVue?

What steps should I take to ensure that the getElementsbyName function works properly on both Internet Explorer and Firefox browsers

Is it better to include the Google Analytics code in the master page or on every individual page of an asp.net

Accessing node postgres and fetching combined fields with duplicate names

Execute a function singularly upon vertical scrolling upwards or downwards

Ways to stop CKEDITOR from automatically saving textarea or contenteditable content

Need help in setting the default TIME for the p-calendar component in Angular Primeng version 5.2.7?

Refresh a div element automatically with information from a different webpage using jQuery

Using HTML and JavaScript to implement a dragging functionality on a canvas element

Display the user's location on Google Maps in addition to all other markers for a comprehensive view

Creating a user-friendly form with validation in a Vue application using Vuetify.js

Ways to eliminate an object from an array using Javascript or Jquery

Identify duplicate values in an array by comparing pairs of elements

Tips for creating a seamless merge from background color to a pristine white hue

JavaScript encounters an unexpected identifier: Syntax Error

When using TypeScript in React, the event handler for the onLoad event of an image element cannot locate the properties naturalWidth and naturalHeight

Generate a new TreeView using the checked checkboxes from a current TreeView