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()

Solution

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 =[];
for(var j = 0; j < data.length; j++){
  const item = data[j];
  if(item.sortCriteria === 1){
    // colect item, its index and sort value with sortCriteria === 1
    items.push([item, item.name.toLowerCase()]);
    idxs.push(j);
  }
}
// sort by the sort value
items.sort(function(a, b){
  return a[1] > b[1] ? 1 : a[1] < b[1] ? -1 : 0;
});
// put sorted items back into the data array using collected indices
let idx = 0;
for(var j = 0; j < items.length; j++){
  data[idxs[idx++]] = items[j][0];
}

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

And a benchmark with test data x 1000000.

<script benchmark data-count="1">

    var chunk = [{name : "Cccc", sortCriteria : 0},  
{name : "Dddd", sortCriteria : 0}, {name : "Eeee", sortCriteria : 1}, {name : "Ffff", sortCriteria : 0}, {name : "Bbbb", sortCriteria : 1}];
    var data = [];
    for (let j = 0; j < 1000000; j++) {
        data.push(...chunk);
    }
    
    // @benchmark Alexander's solution

    var items = [], idxs =[];
    for(var j = 0; j < data.length; j++){
      const item = data[j];
      if(item.sortCriteria === 1){
    // colect item, its index and sort value with sortCriteria === 1
    items.push([item, item.name.toLowerCase()]);
    idxs.push(j);
      }
    }
    // sort by the sort value
    items.sort(function(a, b){
      return a[1] > b[1] ? 1 : a[1] < b[1] ? -1 : 0;
    });
    // put sorted items back into the data array using collected indices
    let idx = 0;
    for(var j = 0; j < items.length; j++){
      data[idxs[idx++]] = items[j][0];
    }

    data;    

    // @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;
            }),
            index = 0,
        sorted = data.map(function (item) {
            return item.sortCriteria === 1
                ? data2[indices[index++]]
                : item;
        });
    sorted;    



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