1. 程式人生 > 實用技巧 >高階函式 filter/map/reduce

高階函式 filter/map/reduce

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>高階函式</title>
</head>
<body>
<script>
//
  const nums = [11, 222,444,55,66,23,90]
// 1、需求:取出所有小於100的值
//2、 需求:取出的小於100的值乘以2
// 3、 需求:上面的值相加

//之前的程式設計方法
//1、需求:取出所有小於100的值
//let newNums = []
//for(let i of nums){
// if(i < 100){ // newNums.push(i) // } //} //console.log(newNums); ////2、需求:取出的小於100的值乘以2 //let new2Nums = [] //for(let i of newNums){ // new2Nums.push(i * 2) //} //console.log(new2Nums); ////3、需求:上面的值相加 //let total = 0 //for(let i of new2Nums){ // total += i //} //console.log(total); //高階函式 filter/map/reduce //1、filter裡面的引數是一個函式,引數函式返回一個Boolean值,如果是true,則加入新陣列,false則不加人
let newNums = nums.filter(function (n) { return n <100 }) console.log(newNums); //map() let new2Nums = newNums.map(function (n) { return n * 2 }) console.log(new2Nums); //reduce(函式引數(前一個值,值),引數2),彙總函式 let total = new2Nums.reduce(function (preValue,n) { return preValue + n },0) console.log(total);
//要掌握的,閱讀性強 let total2 = nums.filter(function (n) { return n < 100 }).map(function (n) { return n * 2 }).reduce(function (preValue,n) { return preValue + n },0) console.log(total2); //箭頭函式 let total3 = nums.filter(n => n < 100).map(n => n * 2).reduce((preValue,n) => preValue + n) console.log(total3); </script> </body> </html>