반응형
자바 스크립트와 역순으로 배열에서 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.map 및 Array.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 + " ")
});
반응형
'code' 카테고리의 다른 글
PowerShell 또는 C #에서 프로세스에 대한 명령 줄 정보를 가져 오는 방법 (0) | 2020.12.11 |
---|---|
Selenium에서 요소의 속성을 얻는 방법은 무엇입니까? (0) | 2020.12.11 |
MySQL 5.0 인덱스-고유 vs 비 고유 (0) | 2020.12.11 |
오류 : 'void *'에서 'int'로 캐스트하면 정밀도가 손실됩니다. (0) | 2020.12.11 |
x가 여러 값과 같은 곳에서 선택하는 방법은 무엇입니까? (0) | 2020.12.10 |