Question 193915 in Javascript Question posted in
A very good W3school tutorial can be found here.

javascript : Sort a subset of an array (created by a filter)

I’m trying to sort only a subset of an array, the subset is a filtered version of that array, and I need the whole array (with the subset sorted ) as a result.

Here is the main array :

var data = [
  { name: "Cccc", sortCriteria: 1 },
  { name: "Bbbb", sortCriteria: 1 },
  { name: "Dddd", sortCriteria: 0 },
  { name: "Eeee", sortCriteria: 1 },
  { name: "Ffff", sortCriteria: 0 },
];

The sort criteria is used to filter the array :

var data2 = data.filter(function (attribute) {
  return attribute.sortCriteria == 1;
});

Finally i’m sorting the filtered array :

var data3 = data2.sort(function (a, b) {
  var aname = a.name.toLowerCase();
  var bname = b.name.toLowerCase();
  if (aname < bname) {
    return -1;
  }
  if (aname > bname) {
    return 1;
  }
});

Every step works but data2 & data3 are subset only (i need the wole array) and data is obviously not sorted.

My result should be :

Bbbb
Cccc
Dddd
Eeee
Ffff

Any idea how that can be done using ecmascript 5 (the order can be random, this is a example) ?

Edit : the following question doesnt address my issue because it’s not ecma5 compliant.

Javascript – Sort the elements of the array without changing positions of certain elements using Array.sort()

Tags:

5

Answers


  1. 0 
    var data = [{
    name: "Cccc",
    sortCriteria: 1
  }, {
    name: "Bbbb",
    sortCriteria: 1
  },
  {
    name: "Dddd",
    sortCriteria: 0
  }, {
    name: "Eeee",
    sortCriteria: 1
  }, {
    name: "Ffff",
    sortCriteria: 0
  }
];

let sortChar = data.sort((a, b) => a.name.localeCompare(b.name));
console.log(sortChar);
    Login or Signup to reply.
  2. 0

    You can store the original index of each element while filtering manually, then use those indexes to update the positions of the objects back in the original array.

    var data = [{name : "Cccc", sortCriteria : 1}, {name : "Bbbb", sortCriteria : 1}, {name : "Dddd", sortCriteria : 0}, {name : "Eeee", sortCriteria : 1}, {name : "Ffff", sortCriteria : 0}];
var filtered = [], origIdx = [];
for (var i = 0; i < data.length; i++)
  if (data[i].sortCriteria === 1) 
    filtered.push(data[i]), origIdx.push(i);
filtered.sort(function(a, b){return a.name.toLowerCase().localeCompare(b.name.toLowerCase())});
for (var i = 0; i < filtered.length; i++)
  data[origIdx[i]] = filtered[i];
console.log(data);
    Login or Signup to reply.
  3. 0

    First you have problem with your test data. If it’s sorted without even sortCriteria in mind the result will be the same. So I’ve changed the test data to make it more obvious.

    We remember indices of items with sortCriteria, sort them and push back to data at remembered indices.

    NOTICE: changed Cccc‘s sortCriteria to 0 so it would be clear that it’s not sorted and stays at index 0, also Bbbb moved to the end so it should appear before `Eeee’ after the sorting:

    var data = [{name : "Cccc", sortCriteria : 0},  
{name : "Dddd", sortCriteria : 0}, {name : "Eeee", sortCriteria : 1}, {name : "Ffff", sortCriteria : 0}, {name : "Bbbb", sortCriteria : 1}];

var items = [], idxs = [];
data.forEach(function(item, idx){
  item.sortCriteria && items.push(item) && idxs.push(idx);
});

items.sort(function(a, b){
  a = a.name.toLowerCase();
  b = b.name.toLowerCase();
  return a > b ? 1 : a < b ? -1 : 0;
});

var i = 0;
items.forEach(function(item){ 
  data[idxs[i++]] = item;
});

//not es2015, just logging
console.log(data.map(({name})=>name));

    And a benchmark with test data x 15000.
    When tested noticed that Nina’s solution’s performance drops exponentially.

    enter image description here

    <script benchmark data-count="1">

    var chunk = [{ name: "Cccc", sortCriteria: 1 }, { name: "Bbbb", sortCriteria: 1 }, { name: "Dddd", sortCriteria: 0 }, { name: "Eeee", sortCriteria: 1 }, { name: "Ffff", sortCriteria: 0 }];
    var data = [];
    for (let i = 0; i < 15000; i++) {
        data = data.concat(chunk);
    }

    // @benchmark Nina's solution

    var data2 = data.filter(function (item) {
        return item.sortCriteria === 1;
    }),
        indices = data2
            .map(function (_, i) {
                return i;
            })
            .sort(function (a, b) {
                var aname = data2[a].name.toLowerCase(),
                    bname = data2[b].name.toLowerCase();

                if (aname < bname) return -1;
                if (aname > bname) return 1;
                return 0;
            }),
        sorted = data.map(function (item) {
            return item.sortCriteria === 1
                ? data2[indices.shift()]
                : item;
        });
    sorted;    

    // @benchmark Alexander's solution

    var items = [], idxs = [];
    data.forEach(function(item, idx){
      item.sortCriteria && items.push(item) && idxs.push(idx);
    });

    items.sort(function(a, b){
      a = a.name.toLowerCase();
      b = b.name.toLowerCase();
      return a > b ? 1 : a < b ? -1 : 0;
    });

    var idx = 0;
    items.forEach(function(item){ 
      data[idxs[idx++]] = item;
    });

    data;

</script>
<script src="https://cdn.jsdelivr.net/gh/silentmantra/benchmark/loader.js"></script>

    ES6+ version:

    var data = [{name : "Cccc", sortCriteria : 0},  
{name : "Dddd", sortCriteria : 0}, {name : "Eeee", sortCriteria : 1}, {name : "Ffff", sortCriteria : 0}, {name : "Bbbb", sortCriteria : 1}];

const items = [], idxs = [];
data.forEach((item, idx) => item.sortCriteria && items.push(item) && idxs.push(idx));

items.sort((a, b) => {
  a = a.name.toLowerCase();
  b = b.name.toLowerCase();
  return a > b ? 1 : a < b ? -1 : 0;
});
let i = 0;
items.forEach(item => data[idxs[i++]] = item);

console.log(data.map(({name})=>name));
    Login or Signup to reply.
  4. 0

    Just add if (!a.sortCriteria || !b.sortCriteria) return 0; at the beginning of the sorting function to avoid sorting elements with sortCriteria 0. (Array.prototype.sort() sorts in-place, so there is no need to var data2 = data.sort(...) – data and data2 is the same array here.

    var data = [
  { name: "Cccc", sortCriteria: 1 },
  { name: "Bbbb", sortCriteria: 1 },
  { name: "Dddd", sortCriteria: 0 },
  { name: "Eeee", sortCriteria: 1 },
  { name: "Ffff", sortCriteria: 0 },
];

data.sort(function(a, b) {
    if (!a.sortCriteria || !b.sortCriteria) return 0;
    var aname = a.name.toLowerCase();
    var bname = b.name.toLowerCase();
    if (aname < bname) return -1;
    if (aname > bname) return 1;
    return 0;
});

console.log(data);
    Login or Signup to reply.
  5. 0

    You could get an array of the items fro sorting and their indices and sort the indices an map a new array with either not sorted items or sorted items.

    var data = [{ name: "Cccc", sortCriteria: 1 }, { name: "Bbbb", sortCriteria: 1 }, { name: "Dddd", sortCriteria: 0 }, { name: "Eeee", sortCriteria: 1 }, { name: "Ffff", sortCriteria: 0 }],
    data2 = data.filter(function (item) {
        return item.sortCriteria === 1;
    }),
    indices = data2
        .map(function (_, i) {
            return i;
        })
        .sort(function (a, b) {
            var aname = data2[a].name.toLowerCase(),
                bname = data2[b].name.toLowerCase();

            if (aname < bname) return -1;
            if (aname > bname) return 1;
            return 0;
        }),
    index = 0,
    sorted = data.map(function (item) {
        return item.sortCriteria === 1
            ? data2[indices[index++]]
            : item;
    });

console.log(sorted);
    .as-console-wrapper { max-height: 100% !important; top: 0; }
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search