Merge two JSON arrays without specifying which fields to combine explicitly

After converting two Excel sheets to JSON using an online tool, two separate JSON properties were created for each sheet. The resulting JSON example looks like this:

{
  "Product Info": [
    {
      // Product information details here
    },
    {
      // Another product information details here
    }
  ],
  "Company Pricing": [
    {
      // Company pricing details here
    },
    {
      // Another company pricing details here
    }
  ]
}

Now, the goal is to merge these two properties into a single property that combines all the fields from "Product Info" with the relevant data from "Company Pricing". This can be achieved by performing a left join on "Pricing Reference Name" and "Part Num". While a loop could be used to iterate over each field and push the matching values, there may be a more efficient way to accomplish this without explicitly naming each field, especially considering potential changes in field names over time. Is it possible to achieve this using spread notation (...) to bring over all fields? Any guidance or examples would be greatly appreciated since I haven't found a similar request on Stack Overflow.

Answer №1

One way to accomplish this task is by organizing the Company Pricing data into a Map based on the Part Num. Then you can process the Product Info information, using the Pricing Reference Name as the key to retrieve the corresponding pricing from the Map:

const products = {
  "Product Info": [
    {
      "ID": 1,
      "Fuel Source": "Wood",
      "Type": "Freestanding",
      "Model": "F1150",
      ...
    },
    {
      "ID": 2,
      "Fuel Source": "Wood",
      "Type": "Freestanding",
      "Model": "F2450",
      ...
    }
  ],
  "Company Pricing": [
    {
      "Part Num": "001-915",
      "Part Description": "Gravity Air Kit Z2510/FP90/CF780",
      "Prod Group": "08-WOOD",
      "MSPR USD": 975
    },
    ...
  ]
}

const pricing = new Map(products['Company Pricing'].map(o => [o['Part Num'], o]))

const result = products['Product Info'].map(o => ({ ...o, ...pricing.get(o['Pricing Reference Name']), }))

console.log(result)

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

How to Collapse or Expand Grouped Items in Vuetify 2 Data Tables

Currently, in my table, I have multiple items grouped by a string property and all groups are expanded by default. If you would like more information on the tables I am using, please visit https://vuetifyjs.com/en/components/data-tables/#grouped-rows Is ...

VueJS intricate v-if condition

Is there a way to display a button only if two specific conditions are met? I attempted to use v-if with one condition at a time: v-if="editMode" v-if="$can('customersdelete')" When using only one condition at a time, the button displays. This ...

We are experiencing difficulties rendering flash messages in Expressjs with Handlebars(hbs) and express-messages using flash-connect

I'm working on an express app and I want to display flash messages when a user signs up using a form. The technologies I am utilizing include Node.js, Express.js, Handlebars(hbs), connect-flash, and express-messages. To make finding errors easier, I ...

What is the best way to separate one dropdown area from another dropdown area?

I have two dropdown menus where, when an option with the value "other" is clicked, it generates a text area just below the dropdown menu. Both sections are functioning correctly, but I had to create separate parent wrappers for each in order to do so. How ...

Flot causes the x-axis display to show incorrect time after a certain period of time

Recently, I encountered an issue with jquery flot while working on a real-time chart. Everything seemed to be functioning properly at first, but after some time had passed, I noticed a significant problem. Initially, the chart was updating correctly; howe ...

I possess a JSON object retrieved from Drafter, and my sole interest lies in extracting the schema from it

Working with node to utilize drafter for generating a json schema for an application brings about too much unnecessary output from drafter. The generated json is extensive, but I only require a small portion of it. Here is the full output: { "element": ...

The program encountered an IllegalStateException: Anticipated the start of an object but found a string instead on line 1

I'm currently facing a challenge with serializing the following JSON data in Java [{ "clear": "0", "default": ["123","234"], "mandatory": "1", "visible": ...

What is the best way to eliminate whitespaces and newlines when using "document.execCommand("copy")" function?

I'm currently working on a code that allows users to copy highlighted text without using the keyboard or right-clicking. I also need to remove any extra spaces or line breaks using regex after the text is selected. However, I am facing some issues wit ...

How can I use a Vue.js function to extract latitude and longitude data from a nested JSON file?

When using getcoords(), I am only getting the first latitude and longitude for all entries in my array. However, when using the normal syntax {{fire.latitude}},{{fire.longitude}}, I am able to retrieve all latitudes and longitudes. I'm not sure why t ...

Maintain loading state in parent component while the child component's react query is still loading

Within my React application, I have a parent component that sends a request to our API. While waiting for the response, a loader is displayed on the page. Once the response is received, I iterate through the data and pass each iteration to a child componen ...

Caution: React alert for utilizing the UNSAFE_componentWillReceiveProps in strict mode

As a newcomer to React, I encountered a warning that has me stuck. Despite researching extensively online, I still can't resolve it. The warning message is: https://i.stack.imgur.com/4yNsc.png Here are the relevant portions of the code in App.tsx: ...

Can you specify the third argument sent to the listener?

Recently I delved into exploring the capabilities of the d3 framework. One thing that caught my attention was the presence of a third parameter in the event listener for v3. Despite always being 0, I couldn't find any explanation on its intended purpo ...

Efficiently removing a duplicated component in Vue: A step-by-step guide

I am trying to find a way to target and remove a component that I duplicated using the v-for directive in my multiple stopwatch application. Currently, I can only delete the last duplicated component, but I want the ability to remove any targeted component ...

Creating a JavaScript alert in Selenium Java WebDriver with a concise message

While running a Selenium Java program, I am attempting to create a JavaScript alert window with a specific string message. I came across a method that involves executing JavaScript within Selenium by interacting with hidden elements: WebDriver driver; Java ...

Jackson does not identify the field, even though it is clearly defined within the class

My current class setup is as follows: public static class Person { public Person(){ } // Getters for various fields public String get_id() { return _id; } // More getters... @Override ...

In Vue.js, the properties of components are not defined

Currently, I am experiencing an issue where I am passing a props to one of my views, but when I print the result in console it shows up as undefined. This is causing difficulties as I am unable to make requests or consults. Here is the code snippet in ques ...

Utilizing the power of jQuery's $.each method to dynamically generate HTML select options within an AJAX

I am working with a bootstrap modal that includes a form which requires data from the database. To retrieve this data, I am using PHP as shown below: public function get_view_for_inspection_report_belum_eor(){ $q = $this->inspection->get_view_fo ...

Combine the text value from a textbox and the value from a checkbox into a single

I'm trying to solve a challenge regarding appending values from text fields (excluding empty ones) and checkboxes in a specific order to form a string. It should be in the format: name|T|F_name|F|F. Once I've created this string, I plan to send i ...

Retrieving information from a .json file using TypeScript

I am facing an issue with my Angular application. I have successfully loaded a .json file into the application, but getting stuck on accessing the data within the file. I previously asked about this problem but realized that I need help in specifically und ...

How can I make the arrows work on a secondary slider with EasySlider1.7?

I finally managed to get 2 sliders working on my page after reading through several other tutorials. However, I am facing an issue with the Prev & Next arrows on the second slider as they don't seem to work properly. I inherited this page from someon ...