Debe usar funciones de array de JavaScript – Parte 3

Debe usar funciones de array de JavaScript – Parte 1

Debe usar funciones de array de JavaScript – Parte 2

En este artículo, vamos a discutir las siguientes funciones de array de JavaScript

  1. prototipo.reduce()
  2. prototipo.concat()
  3. prototipo.sort()
  4. prototipo.reverse()

1. Array.Prototipo.reduce()

Descripción:  la función Array.prototype.reduce() se usa cuando el programador necesita iterar sobre una array de JavaScript y reducirla a un solo valor. Se llama a una función de devolución de llamada para cada valor en la array de izquierda a derecha. El valor devuelto por la función de devolución de llamada está disponible para el siguiente elemento como argumento para su función de devolución de llamada. En caso de que no se proporcione el valor inicial, la función de devolución de llamada de reduce se llama directamente en el segundo elemento y el primer elemento se pasa como valor anterior. En caso de que la array esté vacía y tampoco se proporcione el valor inicial, se genera un TypeError.

arr.reduce(callback[, initialValue])

Parámetros:

devolución de llamada:  función de devolución de llamada que se llamará para cada elemento de la array arr

  • anteriorValor: valor devuelto por la llamada de función anterior o valor inicial.
  • currentValue: valor del elemento de array actual que se está procesando
  • currentIndex: índice del elemento de array actual que se está procesando
  • array: la array original en la que se llama a reduce.

initialValue (opcional): valor inicial que se usará como anteriorValue cuando se invoque la función de devolución de llamada por primera vez.

Ejemplos de casos de uso:

  1. Para encontrar la suma de una array de números enteros.
function reduceFun1(previousValue, currentValue, index, array){
    return previousValue + currentValue;
}
var result = [1,2,3,4,5].reduce(reduceFun1);
          
console.log(result); // Output : 15
  1. Dada una array de objetos que contienen direcciones de ubicaciones de ventas y encuentre el total de ventas realizadas en NY
var arr=[{name: "customer 1", sales: 500, location: "NY"},
         {name: "customer 1", sales: 200, location: "NJ"},
          {name: "customer 1", sales: 700, location: "NY"},
         {name: "customer 1", sales: 200, location: "ORD"},
         {name: "customer 1", sales: 300, location: "NY"}];
  
        function reduceFun2(previousValue, currentValue, index, array) {
              
            if (currentValue.location === "NY") {
                //console.log(previousValue.sales);
                previousValue.sales =  previousValue.sales + Number(currentValue.sales);
            }
            return previousValue;
        }
  
var totalSalesInNY = arr.reduce(reduceFun2);
  
console.log(totalSalesInNY.sales); // Output: 1500

En el ejemplo anterior, se proporciona un valor inicial 0 al llamar a Array.reduce() en arr. En este caso es necesario proporcionar un valor entero inicial. Esto se debe a que para cada iteración de la función de devolución de llamada, la variable anteriorValue debe tener un valor entero y no un objeto completo. Si no pasamos el initialValue como 0, entonces para la primera iteración, el valor anterior se convertirá en el objeto completo e intentará agregarle un valor entero, lo que generará una salida basura.

2. Array.prototipo.concat()

Descripción : Array.prototype.concat() se usa para concatenar una array con otra array/valor. No cambia ninguna array existente, sino que devuelve una array modificada. Acepta tanto arrays como valores nuevos como un argumento que concatena con la array que llama a la función y devuelve la array resultante.

Sintaxis:

 NewArray = Array1.concat(value1[, value2[, ...[, valueN]]])

Parámetros:
valueN : Nueva array o valor a concatenar a Array1.

Ejemplo de caso de uso:
concatenar 2 arrays enteras:

var arr1 = [1,2,3,4];
var arr2 = [5,6,7,8];
var arr3 = arr1.concat(arr2);
console.log(arr3); // Output :  [1, 2, 3, 4, 5, 6, 7, 8]

Concatenar arrays de 3 enteros:

var arr1 = [1,2,3,4];
var arr2 = [5,6];
var arr3 = [7,8];
var arr4 = arr1.concat(arr2,arr3);
console.log(arr4); // Output :  [1, 2, 3, 4, 5, 6, 7, 8]

Concatenar una array con valores enteros individuales:

var arr1 = [1,2,3,4];
var arr2 = arr1.concat(5,6,7,8);
console.log(arr2); // Output :  [1, 2, 3, 4, 5, 6, 7, 8]

Concatenar una array con otra array y otros valores múltiples:

var arr1 = [1,2,3,4];
var arr2 = [5,6];
var arr3 = arr1.concat(arr2, 7, 8);
console.log(arr3); // Output :  [1, 2, 3, 4, 5, 6, 7, 8]

 3. Array.prototype.sort()

Descripción:  Array.prototype.sort() se usa para ordenar una array. Acepta un argumento opcional compareFunction que define los criterios para determinar qué elemento de la array es pequeño y cuál es más grande. La función de comparación acepta 2 argumentos, es decir, los valores que se comparan. Si value1 es más pequeño, la función de comparación debería devolver un valor negativo. Si value2 es más pequeño, compareFunction debería devolver un valor positivo. En caso de que no se proporcione la función de comparación, la función de comparación predeterminada convierte los elementos de la array en strings y luego compara esas strings en orden de puntos Unicode.

Sintaxis:

arr.sort([compareFunction])

Parámetros:
compareFunction (opcional): Función para definir el orden de clasificación.

Ejemplo de caso de uso:
ordenar una array de enteros simple:

var arr = [3, 1, 5, 4, 2].sort();
console.log(arr); // Output : [1, 2, 3, 4, 5]

Ordenar una array de strings:

var arr = ["Orange", "Apple", "Banana"].sort();
console.log(arr); // Output : ["Apple", "Banana", "Orange"]

Ordenar otra array de enteros:

var arr = [1, 30, 5].sort();
console.log(arr); // Output : [1, 30, 5]

Aquí, el orden de la array ordenada resultante no es correcto. Esto se debe a que estamos usando la sortFunction predeterminada, convierte todos los números enteros en strings y luego los compara en función de su valor Unicode. Dado que 30 < 5 en Unicode, de ahí el orden de clasificación incorrecto.
Ordene la array de enteros usando la función de ordenación:

function sortFun(a,b){
    return a - b;
}
var arr = [1, 30, 5].sort(sortFun);
console.log(arr); // Output : [1, 5, 30]

Aquí, el orden es correcto porque no usamos la sortFunction predeterminada sino nuestra propia sortFunction que compara los valores enteros para decidir el orden de clasificación.
Ordene una array de objetos usando la función de clasificación:

var arr = [{name:"NY",  count: 20},
           {name:"NJ",  count: 5},
           {name:"JFK", count: 60},
           {name:"ORD", count: 1}];
function sortFun(obj1, obj2){
    return obj1.count - obj2.count;
}
arr.sort(sortFun);
console.log(arr);  // Output [{name:"ORD",  count: 1},
                      //         {name:"NJ",  count: 5},
                      //         {name:"NY", count: 20},
                      //         {name:"JFK", count: 60}]

4. Array.prototype.reverse()

Descripción : Array.prototype.reverse() se utiliza para invertir una array de JavaScript. La función Reverse() modifica la array de llamada y devuelve una referencia a la array ahora invertida.

Sintaxis:

array.reverse()

Parámetros:
No Aplicable

Ejemplo de caso de uso:

var arr = [1,2,3,4,5,6,7,8,9,10];
arr.reverse();
console.log(arr); //Output : [10, 9, 8, 7, 6, 5, 4, 3, 2, 1]

Todos los fragmentos de código utilizados en este artículo están disponibles en https://github.com/hjaintech/GeeksForGeeks/blob/master/Array_Functions_3.html

Además, si desea profundizar en las funciones anteriores, puede consultar los siguientes enlaces oficiales.

  1. http://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.21
  2. http://www.ecma-international.org/ecma-262/5.1/#sec-15.5.4.6
  3. http://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.11
  4. http://www.ecma-international.org/ecma-262/5.1/#sec-15.4.4.8

Si también desea exhibir su blog aquí, consulte GBlog para escribir un blog invitado en GeeksforGeeks.

Publicación traducida automáticamente

Artículo escrito por GeeksforGeeks-1 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *