code

자바 스크립트와 역순으로 배열에서 map ()을 사용하는 방법이 있습니까?

codestyles 2020. 12. 11. 08:13
반응형

자바 스크립트와 역순으로 배열에서 map ()을 사용하는 방법이 있습니까?


map()자바 스크립트 배열 에서 함수 를 사용하고 싶지만 역순으로 작동하고 싶습니다.

그 이유는 Meteor 프로젝트에서 스택 된 React 구성 요소를 렌더링하고 있으며 나머지는 아래 이미지를로드하는 동안 최상위 요소가 먼저 렌더링되기를 원하기 때문입니다.

var myArray = ['a', 'b', 'c', 'd', 'e'];
myArray.map(function (el, index, coll) {
    console.log(el + " ")
});

인쇄 a b c d e되지만 인쇄 된 mapReverse ()가 있었으면 좋겠습니다.e d c b a

어떤 제안?


원래 배열을 되돌리고 싶지 않다면 얕은 복사본을 만든 다음 반전 된 배열을 매핑 할 수 있습니다.

myArray.slice(0).reverse().map(function(...

당신이 사용할 수있는 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)


배열을 전혀 변경하지 않고 여기에 한 줄짜리 O (n) 솔루션이 있습니다.

myArray.map((val, index) => myArray[myArray.length - 1 - index]);

mapReverse 함수를 한 번 작성한 다음 사용하는 것을 선호합니다. 또한 이것은 배열을 복사 할 필요가 없습니다.

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 ]

또 다른 해결책은 다음과 같습니다.

const reverseArray = (arr) => arr.map((_, idx, arr) => arr[arr.length - 1 - idx ]);

기본적으로 배열 인덱스로 작업합니다.


스프레드 구문 을 사용 하면 Array.prototype.mapArray.prototype.slice 보다 쉽게 ​​반전되도록 배열을 만들 수 있습니다 .

예를 들면 :

{
  const myArray = ['a', 'b', 'c', 'd', 'e'];
  [...myArray].reverse().map(el => console.log(el + " ")); 
}

명명 된 콜백 기능 사용

const items = [1, 2, 3]; 
const reversedItems = items.map(function iterateItems(item) {
  return item; // or any logic you want to perform
}).reverse();

속기 (명명 된 콜백 함수 없음)-화살표 구문, ES6

const items = [1, 2, 3];
const reversedItems = items.map(item => item).reverse();

결과는 다음과 같습니다.

여기에 이미지 설명 입력


myArray.reverse () 먼저 할 수 있습니다.

var myArray = ['a', 'b', 'c', 'd', 'e'];
myArray.reverse().map(function (el, index, coll) {
    console.log(el + " ")
});

참고 URL : https://stackoverflow.com/questions/36415904/is-there-a-way-to-use-map-on-an-array-in-reverse-order-with-javascript

반응형