亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何獲取數組的最后一項?

如何獲取數組的最后一項?

呼喚遠方 2023-07-14 10:14:12
我有一系列對象。我需要渲染數組最后一項的信息,我嘗試這樣做:<p>{leg.segments[leg.segments.length - 1].arrivalCity.caption},&nbsp;</p>但它一直報錯無法讀取未定義的屬性“標題”。似乎我可以從長度為 2 及以上的數組中獲取項目(或者當專門獲取時,leg.segments[0].arrivalCity.caption但在嘗試僅使用一項渲染數組時出現錯誤)。我無法理解問題是什么,因為它應該只leg.segments[leg.segment[0]]在 array 時返回只有一件商品,沒關系。所有對象都有“caption”鍵,唯一的問題是從 [0] 或 [1] 索引獲取它。該數組是已解析 JSON 的一部分,以下是我映射的一個元素作為示例:"legs" : [   {     "segments" :       [         {           "arrivalCity" :             {               "uid" : "LED",               "caption" : "ST PETERSBURG"             }         },         {           "arrivalCity" :             {               "uid" : "LON",               "caption" : "LONDON"             }         }       ]    },    {       "segments" :         [           {              "arrivalCity" :                {                  "uid" : "MOW",                  "caption" : "MOSCOW"                }           }         ]     } ]我需要在第一種情況下渲染倫敦,在第二種情況下渲染莫斯科。但我可以得到 ST PETERSBURG 和 MOSCOW<p>{leg.segments[0].arrivalCity.caption}</p>或有錯誤<p>{leg.segments[leg.segments.length - 1].arrivalCity.caption}</p>
查看完整描述

3 回答

?
白豬掌柜的

TA貢獻1893條經驗 獲得超10個贊

...引用OP ...

...<p>{leg.segments[0].arrivalCity.caption}</p>或者...<p>{leg.segments[leg.segments.length - 1].arrivalCity.caption}</p>

誤解可能是由于沒有像數組一樣對待legs。因此,為了始終訪問arrivalCity每個segments數組的最后一項,必須legs首先迭代該數組。

使用OP的示例數據并實現一個基本的渲染函數,該函數首先迭代數組,并且僅在每次迭代時始終通過eglegs訪問當前數組的最后一項,正如OP已經正確完成的那樣,除了預期的結果之外,什么都不會失敗將呈現...segmentssegmentList[segmentList.length - 1]

  • 倫敦

  • 莫斯科

... 例子 ...

function renderListOfLastArrivalCities(dataList) {

  const listNode = document.querySelector('.last-arrivals');


  dataList.forEach(({ segments: segmentList }) => {


  //const lastSegmentItem = segmentList[segmentList.length - 1];

  //const arrivalCity = lastSegmentItem && lastSegmentItem.arrivalCity;


    const arrivalCity = segmentList[segmentList.length - 1]?.arrivalCity;

    if (arrivalCity) {


      const itemNode = document.createElement('li');

      itemNode.textContent = arrivalCity.caption || '';


      listNode.appendChild(itemNode);

    }

  })

}


const legs = [{


  "segments": [{

    "arrivalCity": {

      "uid":"LED",

      "caption":"ST PETERSBURG"

    }

  }, {

    "arrivalCity": {

      "uid":"LON",

      "caption":"LONDON"

    }

  }]


}, {


  "segments": [{

    "arrivalCity": {

      "uid":"MOW",

      "caption":"MOSCOW"

    }

  }]


}];


renderListOfLastArrivalCities(legs);

<ul class="last-arrivals"></ul>


查看完整回答
反對 回復 2023-07-14
?
函數式編程

TA貢獻1807條經驗 獲得超9個贊

它無法重現您的問題。請向我們展示您的陣列。

假設你的數組是,

var leg={segments:[{arrivalCity:{caption:"cap1"}}]};

然后如果你跑;

leg.segments[leg.segments.length - 1].arrivalCity.caption

您將看到預期輸出為“cap1”


查看完整回答
反對 回復 2023-07-14
?
神不在的星期二

TA貢獻1963條經驗 獲得超6個贊

看起來就像你leg.segments[leg.segments.length - 1]的,我認為它是沒有arrivalCity屬性的對象。如果有,那么您一定是犯了任何拼寫錯誤,或者您的數據形狀可能不同。

您能否與我們分享您的陣列以供我們查看。


查看完整回答
反對 回復 2023-07-14
  • 3 回答
  • 0 關注
  • 215 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號