Exploring and identifying matching pairs within a JavaScript object

Currently, I have a JavaScript object that looks like this:

records: [
  {
     id: 1,
     name: michael,
     guid: 12345
  },
  {
     id: 2,
     name: jason,
     guid: 12345
  },
  {
     id: 3,
     name: fox,
     guid: 54321
  },
  {
     id: 4,
     name: rachel,
     guid: 54321
  }
];

I am aiming to identify the pairs with matching guids. My idea is to generate a new object that includes both related records. For example:

records: [
    {
       id: 1,
       name: michael,
       guid: 12345,
       id2: 2,
       name2: jason
    },
    {
       id: 3,
       name: fox,
       guid: 54321,
       id2: 4,
       name2: rachel
    }];

How can I achieve this in JavaScript? Is there a specific function available to merge them directly from the original object without creating another one from scratch? Thank you.

javascriptangularjs

Answer №1

One of the first things you should focus on is fixing your syntax errors. Remember to always enclose strings in quotes and use '=' instead of ':'. There are multiple approaches you can take to address this issue, but it's important to show that you're making an effort to learn by posting any code you've already tried.

var employees = [{
    id: 1,
    name: 'Michael',
    guid: 12345
  },
  {
    id: 2,
    name: 'Jason',
    guid: 12345
  },
  {
    id: 3,
    name: 'Fox',
    guid: 54321
  },
  {
    id: 4,
    name: 'Rachel',
    guid: 54321
  }
];

// Using plain JavaScript
var employeeGroups = {};
employees.forEach(function(person) {
  if (!employeeGroups[person.guid]) {
    employeeGroups[person.guid] = [person];
  } else {
    employeeGroups[person.guid].push(person);
  }
});

// Using lodash library
var groupedEmployees = _.groupBy(employees, 'guid');

console.log(employeeGroups, groupedEmployees);

Answer №2

If you want to filter out duplicate records, this code snippet can help:

var records = [
{
   "id": 1,
   "name": "michael",
   "guid": 12345
},
{
   "id": 2,
   "name": "jason",
   "guid": 12345
},
{
   "id": 3,
   "name": "fox",
   "guid": 54321
},
{
   "id": 4,
   "name": "rachel",
   "guid": 54321
}
];

function filterDuplicateRecords(){
  let unique = [...new Set(records.map(item => item.guid))];
  return unique;
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Include a link to a JavaScript file within a dynamically created HTML page in a Delphi VCL application

I am currently developing a Delphi XE5 VCL Forms Application which includes a TIdHTTPServer on the main form. Within this server, there is a CommandGet procedure called IdHTTPServer: procedure TForm1.IdHTTPServerCommandGet(AContext: TIdContext; ARequest ...

javascriptdelphi

Inject $scope into ng-click to access its properties and methods efficiently

While I know this question has been asked before, my situation is a bit unique. <div ng-repeat="hello in hello track by $index"> <div ng-click="data($index)"> {{data}} </div> </div> $scope.data = function($index) { $scope.sweet ...

javascriptangularjshtmlionic-framework

Using Angular.js version 1.6.9, you can dynamically apply a class based on a condition by utilizing the

I am attempting to use ng-class in order to implement conditional styling within an ng-repeat. The condition is supposed to be based on the evaluation of a string within an object data. I am working to apply bold formatting to the 3rd item using this code ...

angularjsng-classangular1.6

What is the best way to send the index of an array to a onClick event in ReactJS?

const DisplayInventory = ({ items }) => <div className="row"> {items.map((item, i) => <div className="item" key={"item_" + i}> <div className="card hoverable col s3"> <img onClick={purchase ...

javascriptreactjsecmascript-6jsx

Utilizing class references within a method

I have been developing a script that is designed to dynamically load content into multiple predefined DIVs located in the topbar section of my website. Within the Topbar Object, there is an object called Ribbon which contains functions for manipulating on ...

javascriptajaxthis

Deliver the GWT module in JavaScript format

Currently, I am in need of the following: I need to create a GWT module that can be seamlessly incorporated into a GWT app without requiring recompilation - essentially a plug-and-play solution. This module should include a widget along with various cla ...

javajavascriptgwtmodule

RegEx for constraining string length

I am attempting to identify all instances where the length of a string is more than 1. This is the regex I am using: string.match(/\B\w+(?=\w)/gi); I also attempted this approach: string.match(/^\B\w+(?=\w){2,}$/gi); Unfor ...

javascriptregex

Error encountered in React Material UI: Appbar - TypeError occurred when attempting to read properties that are undefined (specifically, reading '100')

Currently, I am working on developing a multi-step form using Material UI components. However, upon importing the necessary components, an error is being displayed in my code snippet: import React from 'react'; import { ThemeProvider } from &a ...

javascriptreactjsformsmaterial-uiappbar

Exporting a function to another class using the default export is a common practice

I'm working with two classes, Orders.js and api.js. In api.js, I need to invoke a function called ShowAlertWithDelay. However, due to the existence of a default export named mapStateToProps, I am unable to declare another export. Below is the code sni ...

javascriptreactjsreact-nativereact-redux

Developing a custom AngularJS directive for uploading files as base64

I am interested in creating a directive that handles file uploads (base64 of a file) using ng-flow. I was able to get the directive working without using ngModel, but since I need to use it within a form, it would be better to include it (and also have the ...

angularjsangularjs-directiveangular-ngmodelng-flow

Implementing the disabled attribute in input text fields with Vue.js

There are 2 URLs that I am working with: /register /register?sponsor=4 The first route, /register, provides a clean input field where users can type freely. The second route, on the other hand, pre-fills the input with a value of 4 and disables it, ...

javascriptvue.jsvue-router

AngularJS views malfunctioning following oauth redirect

I am in the process of creating a web application using AngularJS and Firebase. Recently, I added a second page along with an ng-view to my index file. In order to facilitate login via Facebook or Google, I am utilizing the $firebaseAuth service. However, ...

javascriptangularjsoauthfirebasesingle-page-application

Using jQuery to remove the functionality of a file input button is ineffective

I am having trouble with an input type file element: <input type="file" name="val1" /> And I'm using this jQuery code: $("input[name='val1']").off("click"); However, the above script, which is already included in a $(function() { } ...

javascriptjquery

Tips for customizing the color of the current date in the angular-material datepicker

I've created a function in angular-material to disable dates two days from now, but I'm struggling to change the color of the current date if it's disabled. The issue is that when the current date is disabled, it displays in a very light blu ...

javascriptcssangularjsdatepickerangular-material

How should you proceed when npm install cannot locate a specific dependency, even though you can easily download it manually?

Currently, I am faced with a dilemma while attempting to execute a JavaScript file that is accompanied by a package.json file. The issue arises during the npm install command in the folder as it fails to locate one of the dependencies. To address this pro ...

javascriptnpm

Fixed position of Material UI tooltip popper when the word length increases

https://i.sstatic.net/mXcqy.png I am striving to replicate the image above by customizing the MUI tooltip properties, but instead, I am only able to achieve this result: https://i.sstatic.net/Rr79x.png By applying a margin to the popper element, I was a ...

javascriptreactjsmaterial-uicss-selectors

Acquiring offspring records from Firebase by employing distinct, auto-generated identifiers

Here's the scenario: The data on our firebase is structured in the following way https://i.stack.imgur.com/RsYo5.jpg The image above illustrates a sample database where "post1" and "post2" under the "Posts" node are randomly generated keys like "Yy ...

angularjsfirebase-realtime-databaseangularfire

Instead of using setTimeout in useEffect to wait for props, opt for an alternative

Looking for a more efficient alternative to using setTimeout in conjunction with props and the useEffect() hook. Currently, the code is functional: const sessionCookie = getCookie('_session'); const { verifiedEmail } = props.credentials; const [l ...

javascriptreactjs

Use vtip jQuery for showcasing titles

Currently, I am utilizing the vTip plugin for displaying titles upon hover. Here is a snippet of my code: http://jsfiddle.net/bnjSs/ In my HTML, there's a Div with the ID #showTitles. Whenever this Div is clicked, I aim to toggle the display of all ...

javascriptjquery

Is there a way to dynamically add an option to multiple select boxes and then only redirect the browser if that specific option is chosen using jquery/js?

Presently, this is the code I am working with. The URL validator is specifically included because there was an issue with redirection occurring on any option selected, however, I only want a redirect to happen when the options I add with jQuery are clicked ...

javascriptjquery