Home / Questions / 51636
Accepted
user13558
Asked: 2020-02-25 11:34:24 +0800 CST 2020-02-25 11:34:24 +0800 CST

How to sort a 2D array by multiple columns in Javascript?

  • 772

Last week, that is, on February 13, 2017, I asked a question.

How to sort a two dimensional array by columns in Javascript?

But that works for sorting a single column. When two elements of the column to sort are the same, it should be able to sort that sector by another column, but it doesn't.

The array I want to sort is the following:

var matriz = [
//Columnas:    0 1 2 3 4
/*Filas:  0*/ [9,5,3,2,7],
/*        1*/ [7,9,5,4,3],
/*        2*/ [8,4,6,0,1],
/*        3*/ [9,9,6,2,1]
             ]

With the current algorithm, sorting column 3 , the answer is as follows:

var matriz = [
//Columnas:    0 1 2 3 4
/*Filas:  0*/ [7,9,5,4,3],
/*        1*/ [9,5,3,2,7],
/*        2*/ [9,9,6,2,1],
/*        3*/ [8,4,6,0,1]
             ]

It's not too bad, it's sorted 4 2 2 0, but the rows that have the 2 , should be sorted by the columns I want.

To be exact, the function that sorts should receive an array (a sequence) with all the columns that I want to sort, for example, [3,0,1,2,4]. This means that first it sorts by column 3, in case they are equal ( 2 ), it sorts those by 0, but 9 is also the same, so it sorts by 1, and it would be sorted, but just in case, too order by 1, 2 and 4.

Also, to make it more general, it would be good to change whether the column is ascending or descending, for this, instead of an array it should be a matrix, the first column is the number of the column to sort, and the second column is a boolean indicating truewhether it is descending, and falsewhether it is descending.

var columnas = [//  Columna - esDescendente
                  [   3,        true ],
                  [   0,        true ],
                  [   1,        true ],
                  [   2,        false],
                  [   4,        false]
]

With this parameter, the result should be the following:

var matriz = [
//Columnas:    0 1 2 3 4
/*Filas:  0*/ [7,9,5,4,3],
/*        1*/ [9,9,6,2,1],
/*        2*/ [9,5,3,2,7],
/*        3*/ [8,4,6,0,1]
             ]

The sort order is not static, but is generated by a function.

function generar_compara(columna,esDescendente)
{
  var menos=1-2*esDescendente
  var devuelve="return a["+columna+"]>=b["+columna+"]?"+menos+":"+(-menos)
  return Function("a","b",devuelve)
}
console.log(generar_compara(0,true))
console.log(generar_compara(1,false))

According to the arguments that I indicate, it generates a different criterion function for me .

  • 0, false->function anonymous(a,b/**/) {return a[0]>=b[0]?-1:1}
  • 1, true->function anonymous(a,b/**/) {return a[1]>=b[1]?1:-1}

My question is: How would the criteria be if I want to order, for example, as follows [3,true],[0,true],[1,true],[2,false],[4,false]? and starting from the example function, how can I build a generator of similar functions, to make it more general?

javascript

5 Answers

  1. A possible solution is to use a recursive function that goes through the column looking for the largest row and, if not found, looks at the next one.
    To control which columns to check, you can use a control array, the same size as the array to check, with true or false as appropriate to use or ignore them in the loop.
    For example:

    	var matriz = [
	//Columnas:    0 1 2 3 4
	/*Filas:  0*/ [9,5,3,2,7],
	/*        1*/ [7,9,5,4,3],
	/*        2*/ [8,4,6,0,1],
	/*        3*/ [9,9,6,2,1]
             ];

	function ordenaMatriz2d (matriz2d,matrizOrden,matrizControl){
		if (!matrizControl){
			matrizControl = [];
			matrizControl.length = matriz2d.length;
			matrizControl.fill(true);
		}
		var matrizOrdenada = [];
		
		var filaMayor = function (matriz2d,matrizOrden,matrizControl,indiceOrden){
			if (!indiceOrden) indiceOrden = 0;
			var columna=matrizOrden[indiceOrden];
			var mayor=null;
			for (let i=0; i<matriz2d.length;i++){
				if (!matrizControl[i]) continue;
				if (mayor===null || matriz2d[i][columna]>matriz2d[mayor][columna]) mayor=i;
				else if (matriz2d[i][columna]==matriz2d[mayor][columna]) {
					if (indiceOrden>=matrizOrden.length) continue;
					var matrizControlRecursivo=[];
					matrizControlRecursivo.length=matrizControl.length;
					matrizControlRecursivo.fill(false);
					matrizControlRecursivo[i]=true;
					matrizControlRecursivo[mayor]=true;
					mayor = filaMayor (matriz2d,matrizOrden,matrizControlRecursivo,indiceOrden+1);
				}
			}
			return mayor;
		}
		var mayor;
		for (let i=0; i<matriz2d.length; i++) {
			mayor=filaMayor(matriz2d,matrizOrden,matrizControl);
			matrizOrdenada.push(matriz2d[mayor]);
			matrizControl[mayor]=false;
		}
		return matrizOrdenada;
	}
	var matrizOrdenada=ordenaMatriz2d(matriz,[3,0,1,2,4]);
	for (let i=0; i<matrizOrdenada.length; i++)
		document.write(matrizOrdenada[i]+"<br>");

    The issue of choosing the order of the column would be to add the address in the control matrix and manage it from the recursive function with a conditional.

    • 4

  2. The criterion function would have to iterate through the array columnas, each element of that array contains a pair of values, like this row [3,true], the 3is the column, the trueis indicates whether it is descending.

    It should be something like this:

    function criterio(a,b,columnas)
{
    for(var i=0;i<columnas.length;i++)
    {
        var columna=columnas[i][0]
        var menos=1-2*columnas[i][1]
        if(a[columna]>b[columna]){return +menos}
        if(a[columna]<b[columna]){return -menos}
    }
    return 0
}

    But since the method sortdoes not send the parameter columnas, the function must be generated with Function, so I convert the function to a text string, inserting the array columnaswith JSON.stringify.

    var matriz = [
//Columnas:    0 1 2 3 4
/*Filas:  0*/ [9,5,3,2,7],
/*        1*/ [7,9,5,4,3],
/*        2*/ [8,4,6,0,1],
/*        3*/ [9,9,6,2,1]
             ]
             
var columnas=[[3,true],[0,true],[1,true],[2,false],[4,false]]

function generar_compara(columnas)
{
	var devuelve="\t"+"var columnas="+JSON.stringify(columnas)+"\n\t"+
		"for(var i=0;i<columnas.length;i++){"+"\n\t\t"+
			"var columna=columnas[i][0]"+"\n\t\t"+
			"var menos=1-2*columnas[i][1]"+"\n\t\t"+
			"if(a[columna]>b[columna]){return +menos}"+"\n\t\t"+
			"if(a[columna]<b[columna]){return -menos}"+"\n\t"+
		"};return 0"
	return Function("a","b",devuelve)
}
function ordenar(matriz,columnas)
{
	var compara=generar_compara(columnas)
	return matriz.slice(0).sort(compara)
}
console.log(JSON.stringify(matriz).replace(/\],\[|]]/g,"\n").slice(2))
copia=ordenar(matriz,columnas)
console.log(JSON.stringify(copia ).replace(/\],\[|]]/g,"\n").slice(2))

    • 3

  3. In order to be able to order by different criterios, instead of supplying an array with [3,false], where 3is the column and falseindicates if it is ASC o DESC, it occurs to me that to make it more "flexible" you could supply an array with [3,fn], where fnis a function that we are going to apply to order the matrix.

    For example:

    function asc(a, b) {
  return a < b ? -1 : (a > b ? 1 : 0);
}

function desc(a, b) {
  return a > b ? -1 : (a < b ? 1 : 0);
}

var criterios = [
  [3, desc],
  [0, desc],
  [1, desc],
  [2, asc],
  [4, asc]
];

    Then, using this "criteria" array, it would remain to order the matrix applying the first criterion of the array and depending on whether the column values ​​are repeated in the ordered rows, apply the following criterion to them.

    demonstration:

    function ordenar(matriz, criterios) {
  var arreglo = matriz.slice(0),
    reglas = criterios.slice(0),
    regla = reglas.shift(),
    columna = regla[0],
    criterio = regla[1];
  
  // Ordenamos por el criterio y columna
  arreglo.sort(function(a, b) {
    return criterio(a[columna], b[columna]);
  });

  // Verificamos filas iguales
  var actual,
    anterior,
    count = 1;
  for(var i = 0; i < arreglo.length; i++) {
    actual = arreglo[i][columna];
    if (actual !== anterior) {
      ordernarIguales();
      count = 1;
    } else {
      count++;
    }
    anterior = actual;
  }
  ordernarIguales();
  return arreglo;
  
  //
  
  function ordernarIguales() {
  	if (count > 1) {
      var sub = arreglo.splice(i - count, count);
      Array.prototype.splice.apply(arreglo, [i - count, 0].concat(ordenar(sub, reglas)));
    }
  }
}

//

function asc(a, b) {
  return a < b ? -1 : (a > b ? 1 : 0);
}

function desc(a, b) {
  return a > b ? -1 : (a < b ? 1 : 0);
}

//// Demo 1
var criterios = [
  [3, desc],
  [0, desc],
  [1, desc],
  [2, asc],
  [4, asc]
];
var matriz = [
  [9,5,3,2,7],
  [7,9,5,4,3],
  [8,4,6,0,1],
  [9,9,6,2,1]
];
console.log('Demo 1');
console.log(matriz.join("\n"));
console.log(ordenar(matriz, criterios).join("\n"));

/// Demo 2

var matriz = [
  [9,5,3,2,7],
  [7,8,5,4,3],
  [8,4,6,0,1],
  [9,8,6,2,1],
  [5,9,5,3,1],
  [5,9,6,3,3]
];
console.log('Demo 2');
console.log(matriz.join("\n"));
console.log(ordenar(matriz, criterios).join("\n"));

    • 2
  4. Best Answer

    Expanding on the same OP's answer, you don't need to use Function (which is a form of eval and is bad practice, as well as being unintuitive for the reader). You can achieve the same thing by simply returning a function expression.

    var columnas=[[3,true],[0,true],[1,true],[2,false],[4,false]]

function generar_compara(columnas)
{
    var criterio = function(a,b)
    {
        for(var i=0;i<columnas.length;i++)
        {
            var columna=columnas[i][0]
            var menos=1-2*columnas[i][1]
            if(a[columna]>b[columna]){return +menos}
            if(a[columna]<b[columna]){return -menos}
        }
        return 0
    };
    return criterio;
}
function ordenar(matriz,columnas)
{
    var compara=generar_compara(columnas)
    return matriz.slice(0).sort(compara)
}

    And for the same it can be expressed as:

    function ordenar(matriz,columnas)
{
    var criterio = function(a,b)
    {
        for(var i=0;i<columnas.length;i++)
        {
            var columna=columnas[i][0]
            var menos=1-2*columnas[i][1]
            if(a[columna]>b[columna]){return +menos}
            if(a[columna]<b[columna]){return -menos}
        }
        return 0
    };

    return matriz.slice(0).sort(criterio);
}
    • 2 
  5. function ordenar(matriz, criterios) {
  var arreglo = matriz.slice(0),
    reglas = criterios.slice(0),
    regla = reglas.shift(),
    columna = regla[0],
    criterio = regla[1];
  
  // Ordenamos por el criterio y columna
  arreglo.sort(function(a, b) {
    return criterio(a[columna], b[columna]);
  });

  // Verificamos filas iguales
  var actual,
    anterior,
    count = 1;
  for(var i = 0; i < arreglo.length; i++) {
    actual = arreglo[i][columna];
    if (actual !== anterior) {
      ordernarIguales();
      count = 1;
    } else {
      count++;
    }
    anterior = actual;
  }
  ordernarIguales();
  return arreglo;
  
  //
  
  function ordernarIguales() {
    if (count > 1) {
      var sub = arreglo.splice(i - count, count);
      Array.prototype.splice.apply(arreglo, [i - count, 0].concat(ordenar(sub, reglas)));
    }
  }
}

//

function asc(a, b) {
  return a < b ? -1 : (a > b ? 1 : 0);
}

function desc(a, b) {
  return a > b ? -1 : (a < b ? 1 : 0);
}

//// Demo 1
var criterios = [
  [3, desc],
  [0, desc],
  [1, desc],
  [2, asc],
  [4, asc]
];
var matriz = [
  [9,5,3,2,7],
  [7,9,5,4,3],
  [8,4,6,0,1],
  [9,9,6,2,1]
];
console.log('Demo 1');
console.log(matriz.join("\n"));
console.log(ordenar(matriz, criterios).join("\n"));

/// Demo 2

var matriz = [
  [9,5,3,2,7],
  [7,8,5,4,3],
  [8,4,6,0,1],
  [9,8,6,2,1],
  [5,9,5,3,1],
  [5,9,6,3,3]
];
console.log('Demo 2');
console.log(matriz.join("\n"));
console.log(ordenar(matriz, criterios).join("\n"));
    • 0