Arrange one array while ensuring the order of the other two arrays remains consistent

Question

Arrange one array while ensuring the order of the other two arrays remains consistent

data = {
    "age": [41, 21, 88],
    "name": ["Rob", "Tom", "Susan"],
    "color": ["Red", "Blue", "Orange"]
}

Is there a way to effectively sort the data in these records based on the values of one specific array while maintaining the original data structure? I have already tried using the sort() function but it seems to break the connection between the different arrays.

data = {
    "age": [21, 41, 88],
    "name": ["Tom", "Rob", "Susan"],
    "color": ["Blue", "Red", "Orange"]
}

javascript arrays sorting chart.js plotly

Answer 1

Answer №1

To maintain the arrays separately, you can obtain the index ordering by first sorting the age array and then arranging each array based on that order:

let info = {
  "age": [41, 21, 88],
  "name": ["Rob", "Tom", "Susan"],
  "color": ["Red", "Blue", "Orange"]
};

let indexOrder = info.age
  .map((a, i) => [a, i])
  .sort((a, b) => a[0] - b[0])
  .map(a => a[1]);

for (let key in info) {
  info[key] = indexOrder.map(i => info[key][i]);
}

console.log(info);

Answer 2

To maintain the arrays separately, you can obtain the index ordering by first sorting the age array and then arranging each array based on that order:

let info = {
  "age": [41, 21, 88],
  "name": ["Rob", "Tom", "Susan"],
  "color": ["Red", "Blue", "Orange"]
};

let indexOrder = info.age
  .map((a, i) => [a, i])
  .sort((a, b) => a[0] - b[0])
  .map(a => a[1]);

for (let key in info) {
  info[key] = indexOrder.map(i => info[key][i]);
}

console.log(info);

Answer 3

Answer №2

It is highly recommended to store such information in a true object-oriented manner, as demonstrated below:

[
  {
    "age": 33,
    "name": "Emily",
    "color": "Green"
  },
  {
    "age": 52,
    "name": "Jack",
    "color": "Yellow"
  },
  {
    "age": 19,
    "name": "Alice",
    "color": "Purple"
  }
]

Although it may seem verbose, this method is superior as the related properties are now tightly linked together.

Sorting can be achieved using the following code snippet:

data.sort((a, b) => a.age - b.age)

Answer 4

It is highly recommended to store such information in a true object-oriented manner, as demonstrated below:

[
  {
    "age": 33,
    "name": "Emily",
    "color": "Green"
  },
  {
    "age": 52,
    "name": "Jack",
    "color": "Yellow"
  },
  {
    "age": 19,
    "name": "Alice",
    "color": "Purple"
  }
]

Although it may seem verbose, this method is superior as the related properties are now tightly linked together.

Sorting can be achieved using the following code snippet:

data.sort((a, b) => a.age - b.age)

Answer 5

Answer №3

One way to organize and arrange your data is by restructuring it:

var information = {
  "id": [123, 456, 789],
  "name": ["Alice", "Bob", "Eve"],
  "location": ["New York", "Los Angeles", "Chicago"]
};
information.id.map(function(y, z) {
  return {
    id: information.id[z],
    name: information.name[z],
    location: information.location[z]
  };
}).sort(function(c, d) {
  // You can customize the sorting order based on the values
  return c.id - d.id;
}).forEach(function(p, q) {
  information.id[q] = p.id;
  information.name[q] = p.name;
  information.location[q] = p.location;
});
console.log(information);

Answer 6

One way to organize and arrange your data is by restructuring it:

var information = {
  "id": [123, 456, 789],
  "name": ["Alice", "Bob", "Eve"],
  "location": ["New York", "Los Angeles", "Chicago"]
};
information.id.map(function(y, z) {
  return {
    id: information.id[z],
    name: information.name[z],
    location: information.location[z]
  };
}).sort(function(c, d) {
  // You can customize the sorting order based on the values
  return c.id - d.id;
}).forEach(function(p, q) {
  information.id[q] = p.id;
  information.name[q] = p.name;
  information.location[q] = p.location;
});
console.log(information);

Answer 7

Answer №4

information = {
    "age": [47, 29, 64],
    "name": ["Sara", "Peter", "Lily"],
    "color": ["Green", "Yellow", "Purple"]
}
var organizeData = info => {
     var dataArr = []
     info.age.forEach(
     (value, index) => {
        dataArr.push(
            {
                age: value, 
                name: info.name[index],
                color: info.color[index]
            }
         )
     })
     dataArr.sort((a, b) => a.age - b.age)
     console.log(info)
     info = {
          age: [],
          name: [],
          color: []
     }
     dataArr.forEach(value => {
          info.age.push(value.age)
          info.name.push(value.name)
          info.color.push(value.color)
     })
     console.log(info)
}
organizeData(information)

Exactly as presented above. Trincot's answer should be followed.

Answer 8

information = {
    "age": [47, 29, 64],
    "name": ["Sara", "Peter", "Lily"],
    "color": ["Green", "Yellow", "Purple"]
}
var organizeData = info => {
     var dataArr = []
     info.age.forEach(
     (value, index) => {
        dataArr.push(
            {
                age: value, 
                name: info.name[index],
                color: info.color[index]
            }
         )
     })
     dataArr.sort((a, b) => a.age - b.age)
     console.log(info)
     info = {
          age: [],
          name: [],
          color: []
     }
     dataArr.forEach(value => {
          info.age.push(value.age)
          info.name.push(value.name)
          info.color.push(value.color)
     })
     console.log(info)
}
organizeData(information)

Exactly as presented above. Trincot's answer should be followed.

Answer 9

Answer №5

Your input contains separate values that should be combined into one object like this:

{
  "age": 41,
  "name": "Rob",
  "color": "Red"
}

One approach is to use the Array.prototype.map function to create the object, then sort it by age using Array.prototype.sort, and finally reassemble the desired output with Array.prototype.reduce.

I suggest reconsidering how the related data is stored.

let data = { "age": [41, 21, 88], "name": ["Rob", "Tom", "Susan"], "color": ["Red", "Blue", "Orange"]},
    obj = data.age.map((age, i) => ({age, name: data.name[i], color: data.color[i]})),
    result = obj.sort(({age: a}, {age: b}) => a - b).reduce((a, c) => {
      a.age.push(c.age);
      a.color.push(c.color);
      a.name.push(c.name);
      return a;
    }, {age: [], color: [], name: []});

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 10

Your input contains separate values that should be combined into one object like this:

{
  "age": 41,
  "name": "Rob",
  "color": "Red"
}

One approach is to use the Array.prototype.map function to create the object, then sort it by age using Array.prototype.sort, and finally reassemble the desired output with Array.prototype.reduce.

I suggest reconsidering how the related data is stored.

let data = { "age": [41, 21, 88], "name": ["Rob", "Tom", "Susan"], "color": ["Red", "Blue", "Orange"]},
    obj = data.age.map((age, i) => ({age, name: data.name[i], color: data.color[i]})),
    result = obj.sort(({age: a}, {age: b}) => a - b).reduce((a, c) => {
      a.age.push(c.age);
      a.color.push(c.color);
      a.name.push(c.name);
      return a;
    }, {age: [], color: [], name: []});

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Arrange one array while ensuring the order of the other two arrays remains consistent

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

Fix the improperly formatted JSON data

Is there a way to avoid waiting for both observables to arrive and utilize the data from just one observable within the switchmap function?

Dealing with Error TS2769 in Visual Studio Code when passing props to a custom component in Vue 2 with Typescript

Having issues with Thymeleaf template not functioning properly when using inline JavaScript

Encountered an error in React JS and Axios when attempting to select a form: "Failed to construct 'FormData': parameter 1 is not of type 'HTMLFormElement'."

"Enhance Your Form with JQuery Date Selector for Multiple Input

How can I loop through map.entities in Bing Maps v7?

Mixing up jQuery's Deferred, jsDeferred, and the concept of deferring in coding can be a common source of confusion

When attempting to execute a promise within a test, encountering a 400 error in a NodeJS environment

How do I show a variable within my react-native render function?

Is Object Cloning the Solution for Creating Multiple Views in THREE.js with Multiple Canvasses? Considerations to Keep in Mind

What is the correct way to establish and terminate a MongoDB connection in a Node.js application?

Wordpress problem with Bootstrap JavaScript code involving data-toggle="collapse"

What is the method for comparing a value in TypeScript that does not match a given value?

Adjusting Classes in JavaScript with jQuery

Unable to assign a className to a personalized React component - troubleshooting needed!

Utilizing jQuery's CSS function to adjust the "left" margin of multiple div elements

50% greater than the highest of the other values

Utilize the ng.IFilterService interface within a TypeScript project

What is the best way to transform an object into a list using javascript?