Tutorial JS

JS INICIO JS Introducción JS Dónde Salida JS Declaraciones JS Sintaxis JS Comentarios JS Variables JS JS Vamos Constante JS Operadores JS Aritmética JS Tarea JS Tipos de datos JS Funciones JS Objetos JS Eventos JS Cadenas JS Métodos de cadena JS Búsqueda de cadenas JS Plantillas de cadena JS Números JS Métodos numéricos JS Matrices JS Métodos de matriz JS Clasificación de matriz JS Iteración de matriz JS Constante de matriz JS Fechas JS Formatos de fecha JS Métodos de obtención de fecha JS Métodos de configuración de fechas JS Matemáticas JS JS al azar Booleanos JS Comparaciones JS Condiciones JS Interruptor JS Bucle JS para Bucle JS para entrada Bucle JS para de Bucle JS mientras descanso JS Iterables JS Conjuntos JS Mapas JS JS Tipo de Conversión de tipo JS JS bit a bit JS expresión regular Errores JS Alcance JS JS Elevación Modo estricto JS JS esta palabra clave Función de flecha JS Clases JS JSJSON Depuración JS Guía de estilo JS Prácticas recomendadas de JS Errores JS Rendimiento JS Palabras reservadas de JS

Versiones JS

Versiones JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Borde Historia de JS

Objetos JS

Definiciones de objetos Propiedades del objeto Métodos de objetos Visualización de objetos Accesores de objetos Constructores de objetos Prototipos de objetos Objeto iterables Conjuntos de objetos Mapas de objetos Referencia de objeto

Funciones JS

Definiciones de funciones Parámetros de función Invocación de funciones Llamada de función Función Aplicar Cierres de funciones

Clases JS

Introducción a la clase Herencia de clase Clase estática

JS asíncrono

Devoluciones de llamada JS JS asíncrono Promesas JS JS asíncrono/espera

JS HTML DOM

Introducción al DOM Métodos DOM Documento DOM Elementos DOM DOM HTML Formularios DOM DOM CSS Animaciones DOM Eventos DOM Oyente de eventos DOM Navegación DOM Nodos DOM Colecciones DOM Listas de nodos DOM

Lista de materiales del navegador JS

Ventana JS Pantalla JS Ubicación de JS Historia de JS Navegador JS Alerta emergente JS Tiempo JS Galletas JS

API web de JS

Introducción a la API web API de formularios web API de historial web API de almacenamiento web API de trabajo web API de búsqueda web API de geolocalización web

JS AJAX

Introducción a AJAX AJAX XMLHttp Solicitud AJAX Respuesta AJAX Archivo XML AJAX AJAXPHP Ajax ASP Base de datos AJAX Aplicaciones AJAX Ejemplos de AJAX

JSJSON

Introducción JSON Sintaxis JSON JSON frente a XML Tipos de datos JSON Análisis JSON Cadena JSON Objetos JSON Matrices JSON Servidor JSON JSONPHP JSONHTML JSON JSONP

JS frente a jQuery

Selectores jQuery HTML de jQuery CSS de jQuery DOM de jQuery

Gráficos JS

Gráficos JS Lienzo JS JS Trazado Gráfico JS.js Gráfico de Google JS JS D3.js

Ejemplos de JS

Ejemplos de JS JS HTML DOM Entrada HTML JS Objetos JS HTML Eventos JS HTML Navegador JS Editor JS Ejercicios JS Prueba JS Certificado JS

Referencias JS

Objetos JavaScript Objetos HTML DOM


Matrices de clasificación de JavaScript


Ordenar una matriz

El sort()método ordena una matriz alfabéticamente:

Ejemplo

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();

Invertir una matriz

El reverse()método invierte los elementos en una matriz.

Puede usarlo para ordenar una matriz en orden descendente:

Ejemplo

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
fruits.reverse();

Clasificación numérica

De forma predeterminada, la sort()función ordena los valores como cadenas .

Esto funciona bien para cadenas ("Apple" viene antes de "Banana").

Sin embargo, si los números se ordenan como cadenas, "25" es mayor que "100", porque "2" es mayor que "1".

Debido a esto, el sort()método producirá un resultado incorrecto al ordenar números.

Puede solucionar esto proporcionando una función de comparación :

Ejemplo

const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});

Use el mismo truco para ordenar una matriz descendente:

Ejemplo

const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a});


La función de comparación

El propósito de la función de comparación es definir un orden de clasificación alternativo.

La función de comparación debe devolver un valor negativo, cero o positivo, según los argumentos:

function(a, b){return a - b}

Cuando la sort()función compara dos valores, envía los valores a la función de comparación y ordena los valores según el valor devuelto (negativo, cero, positivo).

Si el resultado es negativo ase ordena antes b.

Si el resultado es positivo bse ordena antes a.

Si el resultado es 0, no se realizan cambios con el orden de clasificación de los dos valores.

Ejemplo:

La función de comparación compara todos los valores de la matriz, dos valores a la vez (a, b).

Al comparar 40 y 100, el sort()método llama a la función de comparación (40, 100).

La función calcula 40 - 100 (a - b)y, dado que el resultado es negativo (-60), la función de clasificación clasificará 40 como un valor inferior a 100.

Puede usar este fragmento de código para experimentar con la ordenación numérica y alfabética:

<button onclick="myFunction1()">Sort Alphabetically</button>
<button onclick="myFunction2()">Sort Numerically</button>

<p id="demo"></p>

<script>
const points = [40, 100, 1, 5, 25, 10];
document.getElementById("demo").innerHTML = points;

function myFunction1() {
  points.sort();
  document.getElementById("demo").innerHTML = points;
}

function myFunction2() {
  points.sort(function(a, b){return a - b});
  document.getElementById("demo").innerHTML = points;
}
</script>

Ordenar una matriz en orden aleatorio

Ejemplo

const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return 0.5 - Math.random()});


El método Fisher Yates

El ejemplo anterior, array .sort(), no es exacto, favorecerá algunos números sobre otros.

El método correcto más popular se llama el método aleatorio de Fisher Yates y se introdujo en la ciencia de datos ya en 1938.

En JavaScript, el método se puede traducir a esto:

Ejemplo

const points = [40, 100, 1, 5, 25, 10];

for (let i = points.length -1; i > 0; i--) {
  let j = Math.floor(Math.random() * i)
  let k = points[i]
  points[i] = points[j]
  points[j] = k
}


Encuentre el valor de matriz más alto (o más bajo)

No hay funciones integradas para encontrar el valor máximo o mínimo en una matriz.

Sin embargo, después de ordenar una matriz, puede usar el índice para obtener los valores más altos y más bajos.

Clasificación ascendente:

Ejemplo

const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});
// now points[0] contains the lowest value
// and points[points.length-1] contains the highest value

Clasificación descendente:

Ejemplo

const points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a});
// now points[0] contains the highest value
// and points[points.length-1] contains the lowest value

Ordenar una matriz completa es un método muy ineficiente si solo desea encontrar el valor más alto (o más bajo).


Usando Math.max() en una matriz

Puede usar Math.max.applypara encontrar el número más alto en una matriz:

Ejemplo

function myArrayMax(arr) {
  return Math.max.apply(null, arr);
}

Math.max.apply(null, [1, 2, 3])es equivalente a Math.max(1, 2, 3).


Usando Math.min() en una matriz

Puede usar Math.min.applypara encontrar el número más bajo en una matriz:

Ejemplo

function myArrayMin(arr) {
  return Math.min.apply(null, arr);
}

Math.min.apply(null, [1, 2, 3])es equivalente a Math.min(1, 2, 3).


Mis métodos mínimos/máximos de JavaScript

La solución más rápida es utilizar un método "casero".

Esta función recorre una matriz comparando cada valor con el valor más alto encontrado:

Ejemplo (Buscar Max)

function myArrayMax(arr) {
  let len = arr.length;
  let max = -Infinity;
  while (len--) {
    if (arr[len] > max) {
      max = arr[len];
    }
  }
  return max;
}

Esta función recorre una matriz comparando cada valor con el valor más bajo encontrado:

Ejemplo (Buscar mínimo)

function myArrayMin(arr) {
  let len = arr.length;
  let min = Infinity;
  while (len--) {
    if (arr[len] < min) {
      min = arr[len];
    }
  }
  return min;
}


Clasificación de matrices de objetos

Las matrices de JavaScript a menudo contienen objetos:

Ejemplo

const cars = [
  {type:"Volvo", year:2016},
  {type:"Saab", year:2001},
  {type:"BMW", year:2010}
];

Incluso si los objetos tienen propiedades de diferentes tipos de datos, el sort()método se puede usar para ordenar la matriz.

La solución es escribir una función de comparación para comparar los valores de propiedad:

Ejemplo

cars.sort(function(a, b){return a.year - b.year});

Comparar propiedades de cadenas es un poco más complejo:

Ejemplo

cars.sort(function(a, b){
  let x = a.type.toLowerCase();
  let y = b.type.toLowerCase();
  if (x < y) {return -1;}
  if (x > y) {return 1;}
  return 0;
});

Referencia de matriz completa

Para obtener una referencia completa de Array, vaya a nuestro:

Referencia completa de matriz de JavaScript .

La referencia contiene descripciones y ejemplos de todas las propiedades y métodos de Array.

Ponte a prueba con ejercicios

Ejercicio:

Utilice el método Array correcto para ordenar la fruitsmatriz alfabéticamente.

const fruits = ["Banana", "Orange", "Apple", "Kiwi"];
;