Discovering variances among n sets of objects

Within my code, I have an array named props that consists of multiple arrays containing objects. All the arrays have the same number of objects.

Each object in the arrays has four properties: participation_enabled, name, pathing_enabled, and id. These properties may vary in value across objects within different arrays.

My objective is to identify all object properties that differ among the arrays and store them in a new array called diffs.

Let's illustrate this with the following example:

[
  [
    {participation_enabled:"false", name:"PropEins", pathing_enabled:"true", id:"prop1"}, 
    {participation_enabled:"false", name:"User Status", pathing_enabled:"false", id:"prop2"}, 
    {participation_enabled:"false", name:"Initial ID", pathing_enabled:"false", id:"prop3"}, 
    {participation_enabled:"false", name:"User ID", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ], 
  [
    {participation_enabled:"false", name:"PropEins", pathing_enabled:"false", id:"prop1"}, 
    {participation_enabled:"false", name:"Room", pathing_enabled:"false", id:"prop2"}, 
    {participation_enabled:"false", name:"Phase", pathing_enabled:"false", id:"prop3"}, 
    {participation_enabled:"false", name:"Custom Insight 4", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ], 
  [
    {participation_enabled:"true", name:"PropEins", pathing_enabled:"true", id:"prop1"}, 
    {participation_enabled:"true", name:"User Status", pathing_enabled:"true", id:"prop2"}, 
    {participation_enabled:"true", name:"Trackingcode", pathing_enabled:"true", id:"prop3"}, 
    {participation_enabled:"false", name:"User ID", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ]
]

In the above scenario, the diffs array should include the following objects:

[
  {id:"prop1", participation_enabled:["false","true"], pathing_enabled:["false","true"], index:0},
  {id:"prop2", participation_enabled:["false","true"], name:["User Status","Room"], participation_enabled:["false","true"], pathing_enabled:["false","true"], index:1},
  {id:"prop3", participation_enabled:["false","true"], name:["Initial ID","Phase","Trackingcode"], participation_enabled:["false","true"], pathing_enabled:["false","true"], index:2},
  {id:"prop4", name:["User ID","Custom Insight 4"], pathing_enabled:["false","true"], index:3}
]

Any insights on how to achieve this would be highly valued.

Answer №1

Though not the most sophisticated solution, it does the job efficiently by leveraging underscore JS.

I trust this will prove beneficial to you. It would also be a wise idea to incorporate some error handling.

UPDATE Included support for utilizing Google underscore methods. Everything should now function seamlessly. https://sites.google.com/site/scriptsexamples/custom-methods/underscoregs#TOC-_values-Object-obj-

var arr = [
  [
    {participation_enabled:"false", name:"PropEins", pathing_enabled:"true", id:"prop1"}, 
    {participation_enabled:"false", name:"User Status", pathing_enabled:"false", id:"prop2"}, 
    {participation_enabled:"false", name:"Initial ID", pathing_enabled:"false", id:"prop3"}, 
    {participation_enabled:"false", name:"User ID", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ], 
  [
    {participation_enabled:"false", name:"PropEins", pathing_enabled:"false", id:"prop1"}, 
    {participation_enabled:"false", name:"Room", pathing_enabled:"false", id:"prop2"}, 
    {participation_enabled:"false", name:"Phase", pathing_enabled:"false", id:"prop3"}, 
    {participation_enabled:"false", name:"Custom Insight 4", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ], 
  [
    {participation_enabled:"true", name:"PropEins", pathing_enabled:"true", id:"prop1"}, 
    {participation_enabled:"true", name:"User Status", pathing_enabled:"true", id:"prop2"}, 
    {participation_enabled:"true", name:"Trackingcode", pathing_enabled:"true", id:"prop3"}, 
    {participation_enabled:"false", name:"User ID", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ]
];
var result = {};
arr.forEach(function(value, index){
  if (index == 0) {
    value.forEach(function(val1, ind){
      result[val1.id] = {};
      result[val1.id].index = [ind];
      for (var key in val1) {
        result[val1.id][key] = [val1[key]];
      }
    });
  }
  else {
    value.forEach(function(val1){
      var id = val1.id;
      for (var key in val1) {
        result[id][key].push(val1[key]);
      }
    });
  }
});

for (var k in result) {
  var nest = result[k];
  var idx = nest.index.pop();
  for (nestKey in nest) {
    nest[nestKey] =  _.filter(nest[nestKey], function(item, pos) {
      return nest[nestKey].indexOf(item) == pos;
    });
    
    if (nest[nestKey].length < 2) { delete nest[nestKey]; }
    
  }
  result[k].id = k;
  result[k].index = idx
  if (_.keys(result[k]).length < 3) { delete result[k]; }
}

result = _.values(result);

console.log(result);
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

Answer №2

Here is an example of a pure JavaScript solution. It's worth noting that if you are certain all properties contain strings, you could enhance the efficiency by using an object-property based approach instead of the indexOf search to identify duplicates quickly.

One important assumption to consider:

  • The index of an object in the array determines matching objects.

var sampleData = [
  [
    {participation_enabled:"false", name:"PropEins", pathing_enabled:"true", id:"prop1"}, 
    {participation_enabled:"false", name:"User Status", pathing_enabled:"false", id:"prop2"}, 
    {participation_enabled:"false", name:"Initial ID", pathing_enabled:"false", id:"prop3"}, 
    {participation_enabled:"false", name:"User ID", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ], 
  [
    {participation_enabled:"false", name:"PropEins", pathing_enabled:"false", id:"prop1"}, 
    {participation_enabled:"false", name:"Room", pathing_enabled:"false", id:"prop2"}, 
    {participation_enabled:"false", name:"Phase", pathing_enabled:"false", id:"prop3"}, 
    {participation_enabled:"false", name:"Custom Insight 4", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ], 
  [
    {participation_enabled:"true", name:"PropEins", pathing_enabled:"true", id:"prop1"}, 
    {participation_enabled:"true", name:"User Status", pathing_enabled:"true", id:"prop2"}, 
    {participation_enabled:"true", name:"Trackingcode", pathing_enabled:"true", id:"prop3"}, 
    {participation_enabled:"false", name:"User ID", pathing_enabled:"false", id:"prop4"}, 
    {participation_enabled:"false", name:"Subdomain", pathing_enabled:"false", id:"prop5"}
  ]
];

// Merge two similar objects
function mergeObj(obj1, obj2) {
  Object.keys(obj1).forEach(function(key) {
    if (obj1[key] !== obj2[key]) {
      obj1[key] = [].concat(obj1[key]);
      
      if (obj1[key].indexOf(obj2[key]) == -1) {
        obj1[key].push(obj2[key]);
      }
    }
  });
  
  return obj1;
};

// Reduce an array of data arrays into one array of merged objects
function dataReducer(matches, current) {
  current.forEach(function(obj, i) {
    if (!matches[i]) {
      matches[i] = obj;
    } else {
      matches[i] = mergeObj(matches[i], obj);
    }
  });
  
  return matches;
};

var result = sampleData.reduce(dataReducer, []);
console.log(result);

Answer №3

Take a look at the code below. It may not be the most efficient solution, but it does solve the issue.

var mainArray = [
  [{
    participation_enabled: "false",
    name: "PropEins",
    pathing_enabled: "true",
    id: "prop1"
  }, {
    participation_enabled: "false",
    name: "User Status",
    pathing_enabled: "false",
    id: "prop2"
  }, {
    participation_enabled: "false",
    name: "Initial ID",
    pathing_enabled: "false",
    id: "prop3"
  }, {
    participation_enabled: "false",
    name: "User ID",
    pathing_enabled: "false",
    id: "prop4"
  }, {
    participation_enabled: "false",
    name: "Subdomain",
    pathing_enabled: "false",
    id: "prop5"
  }],
  [{
    participation_enabled: "false",
    name: "PropEins",
    pathing_enabled: "false",
    id: "prop1"
  }, {
    participation_enabled: "false",
    name: "Room",
    pathing_enabled: "false",
    id: "prop2"
  }, {
    participation_enabled: "false",
    name: "Phase",
    pathing_enabled: "false",
    id: "prop3"
  }, {
    participation_enabled: "false",
    name: "Custom Insight 4",
    pathing_enabled: "false",
    id: "prop4"
  }, {
    participation_enabled: "false",
    name: "Subdomain",
    pathing_enabled: "false",
    id: "prop5"
  }],
  [{
    participation_enabled: "true",
    name: "PropEins",
    pathing_enabled: "true",
    id: "prop1"
  }, {
    participation_enabled: "true",
    name: "User Status",
    pathing_enabled: "true",
    id: "prop2"
  }, {
    participation_enabled: "true",
    name: "Trackingcode",
    pathing_enabled: "true",
    id: "prop3"
  }, {
    participation_enabled: "false",
    name: "User ID",
    pathing_enabled: "false",
    id: "prop4"
  }, {
    participation_enabled: "false",
    name: "Subdomain",
    pathing_enabled: "false",
    id: "prop5"
  }]
];

var resultArray = mainArray[0];
for (var i = 0; i < mainArray.length; i++) {
  var arrayTocheck = mainArray[i];
  for (var outer = 0; outer < resultArray.length; outer++) {
    row = resultArray[outer];
    if (i == 0) {
      row.participation_enabled = [];
      row.name = [];
      row.pathing_enabled = [];
    }
    for (var inner = 0; inner < resultArray.length; inner++) {
      var rowtoCheck = arrayTocheck[inner];
      if (row.id == rowtoCheck.id) {
        if (!row.participation_enabled.includes(rowtoCheck.participation_enabled) && rowtoCheck.participation_enabled != "") {

          row.participation_enabled.push(rowtoCheck.participation_enabled);
        }
        if (!row.name.includes(rowtoCheck.name) && rowtoCheck.name != "") {
          row.name.push(rowtoCheck.name);
        }
        if (!row.pathing_enabled.includes(rowtoCheck.pathing_enabled) && rowtoCheck.pathing_enabled != "") {
          row.pathing_enabled.push(rowtoCheck.pathing_enabled);
        }
        break;
      }
    }
    resultArray[outer] = row;
  }


}
console.log(resultArray);

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

Is it possible to create a table containing names and scores solely using arrays and methods?

I've been on a quest to uncover the solution to this puzzling problem but have hit a dead end! Essentially, I am faced with the challenge of crafting a program where any number of players can participate in a guessing game by inputting their guesses a ...

Convert components into <input> using the "Edit" button, and store information with the "Save" button

My HTML script looks like this: <ul id="data"> <li>Value 1</li> <li>Value 2</li> <li>Value 3</li> <li>Value 4</li> </ul> <br> <div id="buttons"> ...

Storing an array object in a single SQL column using Laravel

I have a database column called "session" where I need to store all the data below in the form of an array. Here is the data in array format: array:1 [▼ 0 => array:3 [▼ "_token" => "ENzbpMgvlOhMkwE1Fv13hjn9NlCOUolIFBDZ4wJd" "session_start" =&g ...

Best practice for sending intricate variables to JavaScript via HTML

Steering away from PHP's htmlentities, I made a change in my code: <?php echo '<img ... onclick="MP.view(\''.$i->name.'\') />'; ?> However, I decided to go a different route by JSON encoding the ...

What are the benefits of using a static method in JavaScript?

I am trying to develop a method in JavaScript that can validate data in a similar way to C# syntax. Here is an example of my C# code: public static class Validate { public static bool IsValid(this string modelState) { return !String.Is ...

Express Not Serving Static Content Properly

const express = require('express'); const app = express(); app.get('/', (req, res) => { app.use(express.static('../../www')); }) app.listen(8080) Although the documentation states that this should work, unfortunately i ...

Attempting to determine the size of a property within a nested object that exists within an array of objects

I am currently working on implementing a scoring system for two teams. The scoring data is stored in an array that identifies the team (home or away) that scored the goal. My goal is to calculate the total number of goals scored by either team with an ID o ...

What is the process for setting up URL parameters in Express JS?

I am working on creating an URL that can accept a query after the "?" operator. The desired format for the URL is "/search?q=". I am wondering how I can achieve this in Express JS, and also how I can integrate the "&" operator into it. ...

Applying the SELECTED attribute to a jQuery HTML dropdown menu filled with options from a PHP array

I am currently iterating through an array of items and displaying these options using JQuery in an HTML SELECT element. My goal is to compare the current item in the array with a previously selected variable and then set the <option> attribute to se ...

There is no matching overload for this call in React Native

I am working on organizing the styles for elements in order to enhance readability. Here is the code I have written: let styles={ search:{ container:{ position:"absolute", top:0, }, } } After defining the s ...

Guide on how to create multiple bundles using browserify and gulp

I have successfully implemented browserify to bundle up my files, but now I am faced with the challenge of generating multiple bundles. Specifically, I want to create dist/appBundle.js and dist/publicBundle.js. gulp.task("js", function(){ return brow ...

What is the best way to send the name of a list item to a different component in React?

Looking for some help with my current project: https://i.sstatic.net/soj4q.jpg I'm working on implementing the 'Comment' feature, but I'm stuck on how to pass the name of a list item to the 'Comment' component header. You c ...

Changing an array in JavaScript within a function

When working with arrays in JavaScript, how can I mutate the value of an array inside a function? I'm aware that certain array methods can achieve this, but regular assignment doesn't seem to work. var arr = [4]; function changeArray(arr) { ...

Guide on dividing objects according to an element from a nested object within an ArrayList using Java

Here is an example of a list of objects with one object in an array. I want to split the users list into different objects while maintaining the original object structure using Java. The data obtained from the database is shown below, along with the expect ...

Choosing a particular 2D array based on another variable in jQuery and JavaScript

Within my project, I am utilizing 2D arrays to append specific divs under particular circumstances. In an effort to streamline and enhance the code, I attempted to create a variable that would determine which array to utilize based on the id of an HTML < ...

Customizing a thumbnail script to dynamically resize and display images according to their size properties

I am attempting to modify a simple JavaScript script that enlarges an image from a thumbnail whenever it is clicked. The issue I am facing is that the enlarged image is displayed based on a fixed width size. I want the enlarged image to be displayed accord ...

The combination of $watchCollection and multiple expressions is not effective

Having two arrays with boolean values, I attempted to use the $watchCollection function to trigger a message when changes occur in either array. However, it seems that the function is not working as expected. To diagnose the issue, please refer to this ex ...

Retrieve user input from an HTML form and pass it as a parameter in a jQuery AJAX request

Is there a way to pass a value from a user input in an HTML file to jQuery.ajax? Take a look at the code snippet from my JS file: jQuery(document).ready(function() { jQuery.ajax({ type: 'POST', url: 'myurl.asp ...

Utilizing AJAX to retrieve data from a PHP function

Seeking to display the output of an AJAX call; This is my PHP code: if(isset($_POST['date']) ) { echo "<input type='radio' id='date'/>"; } And here's my AJAX code: $.ajax( { type: "POST", url: "sched ...

How come this function is still active even after the script has been dynamically deleted?

I am attempting to dynamically load a new script tag that will replace the jQuery content within the #clickmeDIV DIV. However, even after loading the second script tag into the #clickmeDIV DIV, the original script continues to run despite not being part of ...