객체 배열을 매핑 할 때 중첩 배열의 단일 객체에 액세스

Question

혼란스러운 제목에 대해 사과하십시오!

var listOfProductsToShow = [{ 
    "markets": [{ 
     "date": "2017-10-25", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWsDKs584lSNbhN1t", 
     }, 
     { 
     "date": "2017-10-31", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWtWatedeIHOZZ1Dk", 
     }, 
     { 
     "date": "2017-11-04", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWuWq1c22V2NBh12q", 
     }, 
    ], 
    "price": "9.99", 
    "product": "Chicken Wings", 
    "uid": "-KyRAxDoma3vwKXCiNBU", 
    "unit": "lb", 
    "vendorName": "Bob's Beef", 
    }, 
    { 
    "markets": [{ 
     "date": "2017-10-25", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWsDKs584lSNbhN1t", 
     }, 
     { 
     "date": "2017-10-31", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWtWatedeIHOZZ1Dk", 
     }, 
     { 
     "date": "2017-11-04", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWuWq1c22V2NBh12q", 
     }, 
    ], 
    "price": "9.99", 
    "product": "Burgers", 
    "uid": "-Kyax36Yo0Nr2fm01mgL", 
    "unit": "lb", 
    "vendorName": "Bob's Beef", 
    } 
]; 

내가 시장 배열에 접근하는 것을 시도하고 각 개체에 대해 그 단지 최초의 "시장"필드에서 :

이것은 내가 반응에 이상 매핑하고 배열의 작은 덩어리이다. 아래에서 다음을 시도했지만 오류가 발생했습니다.

{listOfProductsToShow.map((product, idx) => (
    product.markets[0].market 
))} 

어떤 방법이 있을까요? 나는 시장 배열을지도로 표시 할 수 있지만 첫 번째 시장 이름 만 원한다는 것을 알고 있습니다. 어떤 도움을 주셔서 미리 감사드립니다!

Answer 1

아마도 markets 배열이 비어있어 undefined is not an object 오류가 발생했을 수 있습니다. 존재를 먼저 확인하고 존재하지 않는 경우 undefined를 반환하여이 문제를 해결할 수 있습니다. 그런 다음 마지막에 모든 정의되지 않은 값을 필터링 : 마지막 조각이 나에게 잘 대해 보이는

var myArray = [ 
 
    { 
 
    "markets": [ 
 
     { 
 
     "date": "2017-10-25", 
 
     "market": "Tribeca Farmer's Market", 
 
     "uid": "-KxcWsDKs584lSNbhN1t", 
 
     }, 
 
     { 
 
     "date": "2017-10-31", 
 
     "market": "Tribeca Farmer's Market", 
 
     "uid": "-KxcWtWatedeIHOZZ1Dk", 
 
     }, 
 
     { 
 
     "date": "2017-11-04", 
 
     "market": "Tribeca Farmer's Market", 
 
     "uid": "-KxcWuWq1c22V2NBh12q", 
 
     }, 
 
    ], 
 
    "price": "9.99", 
 
    "product": "Chicken Wings", 
 
    "uid": "-KyRAxDoma3vwKXCiNBU", 
 
    "unit": "lb", 
 
    "vendorName": "Bob's Beef", 
 
    }, 
 
    { 
 
    "markets": [ 
 
     { 
 
     "date": "2017-10-25", 
 
     "market": "Tribeca Farmer's Market", 
 
     "uid": "-KxcWsDKs584lSNbhN1t", 
 
     }, 
 
     { 
 
     "date": "2017-10-31", 
 
     "market": "Tribeca Farmer's Market", 
 
     "uid": "-KxcWtWatedeIHOZZ1Dk", 
 
     }, 
 
     { 
 
     "date": "2017-11-04", 
 
     "market": "Tribeca Farmer's Market", 
 
     "uid": "-KxcWuWq1c22V2NBh12q", 
 
     }, 
 
    ], 
 
    "price": "9.99", 
 
    "product": "Burgers", 
 
    "uid": "-Kyax36Yo0Nr2fm01mgL", 
 
    "unit": "lb", 
 
    "vendorName": "Bob's Beef", 
 
    }, 
 
    { 
 
    "markets": [] 
 
    } 
 
]; 
 

 
console.log(myArray) 
 

 
var result = myArray.map(x => x.markets[0] && x.markets[0].market).filter(Boolean) 
 
console.log(result)

Answer 2

let array = [ 
{ 
    "markets": [ 
    { 
     "date": "2017-10-25", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWsDKs584lSNbhN1t", 
    }, 
    { 
     "date": "2017-10-31", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWtWatedeIHOZZ1Dk", 
    }, 
    { 
     "date": "2017-11-04", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWuWq1c22V2NBh12q", 
    }, 
    ], 
    "price": "9.99", 
    "product": "Chicken Wings", 
    "uid": "-KyRAxDoma3vwKXCiNBU", 
    "unit": "lb", 
    "vendorName": "Bob's Beef", 
}, 
{ 
    "markets": [ 
    { 
     "date": "2017-10-25", 
     "market": "Tribeca1 Farmer's Market", 
     "uid": "-KxcWsDKs584lSNbhN1t", 
    }, 
    { 
     "date": "2017-10-31", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWtWatedeIHOZZ1Dk", 
    }, 
    { 
     "date": "2017-11-04", 
     "market": "Tribeca Farmer's Market", 
     "uid": "-KxcWuWq1c22V2NBh12q", 
    }, 
    ], 
    "price": "9.99", 
    "product": "Burgers", 
    "uid": "-Kyax36Yo0Nr2fm01mgL", 
    "unit": "lb", 
    "vendorName": "Bob's Beef", 
}, 
]; 

let values = Object.values(array) 
       .map(item => { return item.markets }) 
       .map(arrayIndexItem => arrayIndexItem.map(item2 => item2.market)) 
       .map(it => it[0]); 
console.log(values);