Quiero usar la map()
función en una matriz de JavaScript, pero me gustaría que funcione en orden inverso.
La razón es que estoy renderizando componentes React apilados en un proyecto Meteor y me gustaría que el elemento de nivel superior se renderice primero mientras que el resto carga las imágenes a continuación.
var myArray = ['a', 'b', 'c', 'd', 'e'];
myArray.map(function (el, index, coll) {
console.log(el + " ")
});
imprime a b c d e
pero desearía que hubiera un mapReverse () que imprimierae d c b a
¿Alguna sugerencia?
javascript
arrays
Robin Newhouse
fuente
fuente
reverse
la matriz?map
devuelve? De lo contrario, debería considerarloforEach
.console.log(coll[coll.length - index - 1] + " ")
Respuestas:
Si no desea revertir la matriz original, puede hacer una copia superficial y luego hacer un mapa de la matriz invertida,
myArray.slice(0).reverse().map(function(...
fuente
slice(0)
es necesario ya quereverse()
devuelve una nueva matriz y no modifica la matriz actual. @ AdamCooper86 espero que cambies eso.reverse()
modifica la matriz original.Sin mutar la matriz en absoluto, aquí hay una solución O (n) de una sola línea que se me ocurrió:
myArray.map((val, index, array) => array[array.length - 1 - index]);
fuente
val
no se usa aquí, así que no creo que esto sea lo que OP estaba buscando. (sigue siendo una buena solución)Puedes usar
Array.prototype.reduceRight()
var myArray = ["a", "b", "c", "d", "e"]; var res = myArray.reduceRight(function (arr, last, index, coll) { console.log(last, index); return (arr = arr.concat(last)) }, []); console.log(res, myArray)
fuente
Con función de devolución de llamada con nombre
const items = [1, 2, 3]; const reversedItems = items.map(function iterateItems(item) { return item; // or any logic you want to perform }).reverse();
Taquigrafía (sin función de devolución de llamada con nombre) - Sintaxis de flecha, ES6
const items = [1, 2, 3]; const reversedItems = items.map(item => item).reverse();
Aqui esta el resultado
fuente
Otra solución podría ser:
const reverseArray = (arr) => arr.map((_, idx, arr) => arr[arr.length - 1 - idx ]);
Básicamente trabajas con los índices de matriz
fuente
Prefiero escribir la función mapReverse una vez y luego usarla. Además, esto no necesita copiar la matriz.
function mapReverse(array, fn) { return array.reduceRight(function (result, el) { result.push(fn(el)); return result; }, []); } console.log(mapReverse([1, 2, 3], function (i) { return i; })) // [ 3, 2, 1 ] console.log(mapReverse([1, 2, 3], function (i) { return i * 2; })) // [ 6, 4, 2 ]
fuente
function mapRevers(reverse) { let reversed = reverse.map( (num,index,reverse) => reverse[(reverse.length-1)-index] ); return reversed; } console.log(mapRevers(myArray));
I Pasas la matriz para mapear Revers y en la función devuelves la matriz invertida. En el mapa cb, simplemente toma los valores con el índice contando desde 10 (longitud) hasta 1 de la matriz pasada
fuente
Aquí está mi solución de TypeScript que es tanto O (n) como más eficiente que las otras soluciones al evitar una ejecución a través de la matriz dos veces:
function reverseMap<T, O>(arg: T[], fn: (a: T) => O) { return arg.map((_, i, arr) => fn(arr[arr.length - i - 1])) }
En JavaScript:
const reverseMap = (arg, fn) => arg.map((_, i, arr) => fn(arr[arr.length - 1 - i])) // Or function reverseMap(arg, fn) { return arg.map((_, i, arr) => fn(arr[arr.length - i - 1])) }
fuente
Puede hacer myArray.reverse () primero.
var myArray = ['a', 'b', 'c', 'd', 'e']; myArray.reverse().map(function (el, index, coll) { console.log(el + " ") });
fuente
Una vieja pregunta, pero para los nuevos espectadores, esta es la mejor manera de invertir la matriz usando map
var myArray = ['a', 'b', 'c', 'd', 'e']; [...myArray].map(() => myArray.pop());
fuente
[...myArray].map((_, _, arr) => arr.pop());
:?