title: Using JavaScript, how to traverse 2 JSON objects, compare their fields and create a new JSON object based on the comparison?
body: <p>My application gets 2 JSON (I've changed some of the values for privacy, but the keys are untouched) objects as responses from different endpoints.</p>
  <p><strong>Object 1</strong></p>
  <pre><code>{
     &quot;data&quot;:{
        &quot;posts&quot;:{
           &quot;edges&quot;:[
              {
                 &quot;node&quot;:{
                    &quot;id&quot;:&quot;cG9zdDoyOA==&quot;,
                    &quot;date&quot;:&quot;2021-08-14T04:10:10&quot;,
                    &quot;title&quot;:&quot;At vero eos et&quot;,
                    &quot;slug&quot;:&quot;At vero eos et&quot;,
                    &quot;extraPostInfo&quot;:{
                       &quot;authorExcerpt&quot;:&quot;At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.&quot;,
                       &quot;thumbImage&quot;:&quot;https://res.cloudinary.com/image.jpg&quot;,
                       &quot;previewImage&quot;:&quot;https://res.cloudinary.com/image.jpg&quot;
                    },
                    &quot;author&quot;:{
                       &quot;node&quot;:{
                          &quot;name&quot;:&quot;et accusamus&quot;,
                          &quot;id&quot;:&quot;dXNlcjoz&quot;
                       }
                    }
                 }
              },
              {
                 &quot;node&quot;:{
                    &quot;id&quot;:&quot;cG9zdDoyMA==&quot;,
                    &quot;date&quot;:&quot;2021-08-07T07:06:15&quot;,
                    &quot;title&quot;:&quot;At vero eos et&quot;,
                    &quot;slug&quot;:&quot;At vero eos et&quot;,
                    &quot;extraPostInfo&quot;:{
                       &quot;authorExcerpt&quot;:&quot;At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.&quot;,
                       &quot;thumbImage&quot;:&quot;https://preview.redd.it/w3kr4m2fi3111.png?auto=webp&amp;s=b4fb4bdfd262de01e49b9f7463d784c6d9013a1b&quot;,
                       &quot;previewImage&quot;:&quot;https://preview.redd.it/w3kr4m2fi3111.png?auto=webp&amp;s=b4fb4bdfd262de01e49b9f7463d784c6d9013a1b&quot;
                    },
                    &quot;author&quot;:{
                       &quot;node&quot;:{
                          &quot;name&quot;:&quot;et accusamus&quot;,
                          &quot;id&quot;:&quot;dXNlcjoy&quot;
                       }
                    }
                 }
              }
           ]
        }
     },
     &quot;extensions&quot;:{
        &quot;debug&quot;:[
           {
              &quot;type&quot;:&quot;DEBUG_LOGS_INACTIVE&quot;,
              &quot;message&quot;:&quot;GraphQL Debug logging is not active. To see debug logs, GRAPHQL_DEBUG must be enabled.&quot;
           }
        ]
     }
  }
  </code></pre>
  <p><strong>Object 2</strong></p>
  <pre><code>{
     &quot;usersData&quot;:[
        {
           &quot;id&quot;:&quot;FJ0i4926gbHnSHAPgF4U&quot;,
           &quot;name&quot;:&quot;Et harum quidem&quot;,
           &quot;imageURL&quot;:&quot;https://res.cloudinary.com/image.jpg&quot;,
           &quot;role&quot;:&quot;author&quot;,
           &quot;wpID&quot;:&quot;dXNlcjoz&quot;
        },
        {
           &quot;id&quot;:&quot;IQxFku4Xhqf5mPmfbYgX&quot;,
           &quot;name&quot;:&quot;Et harum quidem&quot;,
           &quot;role&quot;:&quot;author&quot;,
           &quot;imageURL&quot;:&quot;https://res.cloudinary.com/image.jpg&quot;,
           &quot;wpID&quot;:&quot;cG9zdDoyMA==&quot;
        }
     ]
  }
  </code></pre>
  <p>I want to traverse through both these objects and compare <code>id</code> in <em>object 1</em> with <code>wpID</code> in <em>object 2</em>. If they're equal, I want to inject <code>imageURL</code> (key and value) from <em>object 2</em> into <em>object 1</em> <code>edges.author.node</code> element and return a new updated <em>object 3</em>, which will be a superset of <em>object 1</em> with certain values of <em>object 2</em>.</p>
  <p>*I tried using the map function on both objects, but I still haven't been able to make it work. Any help would be highly appreciated. If I do find the solution, I will post it.</p>