Eu quero usar a map()
função em uma matriz javascript, mas gostaria que funcionasse na ordem inversa.
O motivo é que estou renderizando componentes React empilhados em um projeto Meteor e gostaria que o elemento de nível superior renderizasse primeiro enquanto o resto carrega as imagens abaixo.
var myArray = ['a', 'b', 'c', 'd', 'e'];
myArray.map(function (el, index, coll) {
console.log(el + " ")
});
imprime, a b c d e
mas gostaria que houvesse um mapReverse () que imprimissee d c b a
Alguma sugestão?
javascript
arrays
Robin Newhouse
fonte
fonte
reverse
a matriz?map
retorna? Caso contrário, você deve considerarforEach
.console.log(coll[coll.length - index - 1] + " ")
Respostas:
Se você não quiser inverter a matriz original, você pode fazer uma cópia superficial dela e mapear a matriz invertida,
myArray.slice(0).reverse().map(function(...
fonte
slice(0)
é necessárioreverse()
retornar um novo array e não modifica o array atual. @ AdamCooper86 espero que você mude isso.reverse()
modifica o array original.Sem nenhuma mutação na matriz, aqui está uma solução O (n) de uma linha que eu criei:
myArray.map((val, index, array) => array[array.length - 1 - index]);
fonte
val
não é usado aqui, então não acho que era isso que o OP estava procurando? (ainda é uma boa solução)Você pode 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)
fonte
Com função de retorno de chamada nomeada
const items = [1, 2, 3]; const reversedItems = items.map(function iterateItems(item) { return item; // or any logic you want to perform }).reverse();
Atalho (sem função de retorno de chamada nomeada) - Sintaxe de seta, ES6
const items = [1, 2, 3]; const reversedItems = items.map(item => item).reverse();
Aqui está o resultado
fonte
Outra solução poderia ser:
const reverseArray = (arr) => arr.map((_, idx, arr) => arr[arr.length - 1 - idx ]);
Você basicamente trabalha com os índices de array
fonte
Prefiro escrever a função mapReverse uma vez e depois usá-la. Além disso, não é necessário copiar o array.
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 ]
fonte
function mapRevers(reverse) { let reversed = reverse.map( (num,index,reverse) => reverse[(reverse.length-1)-index] ); return reversed; } console.log(mapRevers(myArray));
I Você passa o array para mapear Revers e na função você retorna o array invertido. No mapa cb você simplesmente pega os valores com o índice contando de 10 (comprimento) até 1 do array passado
fonte
Aqui está minha solução TypeScript que é O (n) e mais eficiente do que as outras soluções, evitando uma execução na matriz duas vezes:
function reverseMap<T, O>(arg: T[], fn: (a: T) => O) { return arg.map((_, i, arr) => fn(arr[arr.length - i - 1])) }
Em 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])) }
fonte
Você pode fazer myArray.reverse () primeiro.
var myArray = ['a', 'b', 'c', 'd', 'e']; myArray.reverse().map(function (el, index, coll) { console.log(el + " ") });
fonte
Uma questão antiga, mas para novos visualizadores, esta é a melhor maneira de reverter a matriz usando o mapa
var myArray = ['a', 'b', 'c', 'd', 'e']; [...myArray].map(() => myArray.pop());
fonte
[...myArray].map((_, _, arr) => arr.pop());
:?