vue之數組遍歷

運行結果

在這裏插入圖片描述

代碼

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>高階函數之數組練習</title>
  <script src="../js/vuejs-2.5.16.js"></script>
</head>
<body>

</body>
<script>
  /*
  * filter() 函數的作用主要是對數組進行條件過濾,條件爲Boolean值  不是true就是false
  * map()  函數的主要作用是對過濾之後的新數組進行重新映射
  * reduce() 函數的主要作用是對數組的結果進行彙總,改函數至少要有兩個參數
  * */
  const arr = [11,52,115,188,68,321,223,64]
  //  寫法一
  let totalFirst = arr.filter(function (n) {
    return n<300
  }).map(function (n) {
    return n*2
  }).reduce(function (pre,n) {
    return pre + n
  },0)
  console.log(totalFirst);
  // 寫法二  (遍歷數組中小於100的)
  let totalSecond = arr.filter( n => n <100).map( n => n*2).reduce((pre,n) => pre+n ,0)
  console.log(totalSecond);
</script>
</html>

發佈了91 篇原創文章 · 獲贊 13 · 訪問量 9850
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章