How do I sort an array grouping by type in javascript?

Question

I'm having a problem with sorting an object.

Lets say my array looks like this:

[{name:'a', type: 'letter', date:'30897887', active: true},
{name:'b', type: 'letter', date:'30897888', active: true},
{name:'c', type: 'number', date:'30897889', active: true},
{name:'d', type: 'letter', date:'30897890', active: false},
{name:'e', type: 'letter', date:'30897895', active: true},
{name:'f', type: 'number', date:'30897878', active: false},
{name:'g', type: 'letter', date:'30897823', active: true},
{name:'h', type: 'idk', date:'30897885456', active: true}]

I need to show the active and the not active ones by toggling the view, in this I've been successful.
What's driving me insane is: I need to group them by type with a specific order. I cannot wrap my head around a method.
Let's say the order should be "all the objects with type = number first, then idk, and letter at the end.".
How can i do it?

Gérôme Grignon · Accepted Answer · 2020-05-22 16:31:23Z

1

It isn't so elegant but here is an example if it can help you :

const array = [{name:'a', type: 'letter', date:'30897887', active: true},
{name:'b', type: 'letter', date:'30897888', active: true},
{name:'c', type: 'number', date:'30897889', active: true},
{name:'d', type: 'letter', date:'30897890', active: false},
{name:'e', type: 'letter', date:'30897895', active: true},
{name:'f', type: 'number', date:'30897878', active: false},
{name:'g', type: 'letter', date:'30897823', active: true},
{name:'h', type: 'idk', date:'30897885456', active: true}];

const types = ['idk', 'letter', 'number'];

let newArray = [];

types.forEach(type => {
  array.forEach(item => {
    if (item.type === type) {
      newArray = [...newArray, item];
    }
  })
});

answered May 22, 2020 at 16:31

Gérôme Grignon

4,2581 gold badge9 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Eldar · Accepted Answer · 2020-05-22 16:43:07Z

You can use priority mapping and then sort the array using that map like below :

let priority = {
  "letter": 1,
  "idk": 2,
  "number": 3
};

arr.sort((a, b) => priority[a.type] - priority[b.type])

const arr = [{
    name: 'a',
    type: 'letter',
    date: '30897887',
    active: true
  },
  {
    name: 'b',
    type: 'letter',
    date: '30897888',
    active: true
  },
  {
    name: 'c',
    type: 'number',
    date: '30897889',
    active: true
  },
  {
    name: 'd',
    type: 'letter',
    date: '30897890',
    active: false
  },
  {
    name: 'e',
    type: 'letter',
    date: '30897895',
    active: true
  },
  {
    name: 'f',
    type: 'number',
    date: '30897878',
    active: false
  },
  {
    name: 'g',
    type: 'letter',
    date: '30897823',
    active: true
  },
  {
    name: 'h',
    type: 'idk',
    date: '30897885456',
    active: true
  }
]

let priority = {
  "letter": 1,
  "idk": 2,
  "number": 3
};

arr.sort((a, b) => priority[a.type] - priority[b.type])
console.log(arr)

 priority = {
  "letter": 3,
  "idk": 2,
  "number": 1
};

arr.sort((a, b) => priority[a.type] - priority[b.type])
console.log(arr)

.as-console-wrapper {height:100%}

Chellappan வ · Accepted Answer · 2020-05-22 16:36:56Z

You can use compare function to define custom sorting order

Try this:

var items = [
{name:'a', type: 'letter', date:'30897887', active: true},
{name:'b', type: 'letter', date:'30897888', active: true},
{name:'c', type: 'number', date:'30897889', active: true},
{name:'d', type: 'letter', date:'30897890', active: false},
{name:'e', type: 'letter', date:'30897895', active: true},
{name:'f', type: 'number', date:'30897878', active: false},
{name:'g', type: 'letter', date:'30897823', active: true},
{name:'h', type: 'idk', date:'30897885456', active: true}
];

items.sort((item1,item2)=>{
 if(item1.type === 'number'){
 return -1;  
}
if(item2.type === 'number'){
 return 1;  
}
if(item1.type === 'idk'){
 return -2;  
}
if(item2.type === 'idk'){
 return 2;  
}
});

console.log(items);

Aakash Garg · Accepted Answer · 2020-05-22 16:56:55Z

0

function customSort(arr, order) {
  var result = [];
  order.forEach((type) => {
      result = [...result,...arr.filter((data) => data.type === type)]
    });
  return result
}

Use it like

customSort(data, ["letter", "number", "string"])

edited May 22, 2020 at 16:56

answered May 22, 2020 at 16:22

Aakash Garg

11k2 gold badges11 silver badges29 bronze badges

4 Comments

Kanza Over a year ago

How does this reflect the specific order?

Aakash Garg Over a year ago

It is sorting on the basis of type in ascending order.

Kanza Over a year ago

I do not need ascending order, i need the array to be sorted by a defined order. I need them to be ordered let's say as type = number first, then idk, and letter at the end.

Aakash Garg Over a year ago

modified my response.

Collectives™ on Stack Overflow

How do I sort an array grouping by type in javascript?

4 Answers 4

Comments

Comments

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related