JavaScript數組reduce()方法怎么用

本篇內容主要講解“JavaScript數組reduce()方法怎么用”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“JavaScript數組reduce()方法怎么用”吧!

將某個值減去數組中的每個元素：

var items = [5, 10, 15];
var reducer = function minus(minusSum, item) {
    return minusSum - item;
}
var total = items.reduce(reducer, 61);
console.log(total); // 31

上例中初始值為number類型，所以返回的結果也是number類型的，如果我們想返回object類型的值，也可以傳入object類型的初始值。

var items = [5, 10, 15];
var reducer = function minus(minusSum, item) {
    minusSum.sum = minusSum.sum - item;
    return minusSum;
}
var total = items.reduce(reducer, {sum: 61});
console.log(total); // {sum: 31}

以上兩例都是reduce()簡單的用法。reduce()是一個很強大的方法，我們還可以用它來處理更復雜的業務邏輯。

例如，求購物車中商品的總價，購物車數據如下：

var goodList = [
    {
        good: 'paper',
        price: 12
    },
    {
        good: 'book',
        price: 58
    },
    {
        good: 'CD',
        price: 15
    }       
]

然后運用reduce()方法可以輕松的獲得所有商品的總價格：

var count = goodList.reduce(function(prev, cur) {
    return cur.price + prev;
}, 0);
console.log(count); // 85

如果用戶有10元的優惠券的話，我們只需要將 -10作為初始值傳入reduce()方法中就可以了。

var count = goodList.reduce(function(prev, cur) {
    return cur.price + prev;
}, -10);
console.log(count); // 75

我們給例子增加一點難度，商城在搞促銷，對商品有一定的折扣，我們應該如何求得商品的總價格呢？利用reduce方法也可以很容易解決的。

var goodList = [
    {
        good: 'paper',
        price: 12
    },
    {
        good: 'book',
        price: 58
    },
    {
        good: 'CD',
        price: 15
    }       
];

var dis = {
    paper: 0.5,
    book: 0.8,
    CD: 0.2
}

var count = goodList.reduce(function(prev, cur) {
    return cur.price + prev;
}, -10);

var qcount = goodList.reduce(function(prev, cur) {
    return cur.price * dis[cur.good] + prev;
}, 0);

console.log(count, qcount); // 75 55.400000000000006

我們這里就忽略JS中的精度問題吧，因為這里主要講解reduce()方法的用法。
再舉一個例子，如何求得一串字符串中每個字母出現的次數？如果我們不用reduce()方法也可以實現的，

代碼如下：

var arrString = 'fghffgaga';
var strArr = arrString.split('');
var rel = {};
var count = 1;
for (var i = 0; i < strArr.length; i++) {
    for (var j = i + 1; j < strArr.length; j++) {
        if (strArr[i] == strArr[j]) {
            count++;
            strArr.splice(j, 1);
            j = j - 1;              
        }

    }
    var qcount = count;
    count = 1;
    rel[strArr[i]] = qcount;    
}
console.log(rel); // {f: 3, g: 3, h: 1, a: 2}

利用reduce()方法的代碼如下：

var arrString = 'fghffgaga';
var rel = arrString.split('').reduce(function(res, cur) {
  res[cur] ? res[cur] ++ : res[cur] = 1
  return res;
}, {})
console.log(rel); // {f: 3, g: 3, h: 1, a: 2}

哈哈，利用reduce()方法來處理的話，代碼是不是簡單了很多？
我們可以用reduce()方法來對數組中的每個元素來做各種處理，將一種類型的數組轉換成另一種類型的數組。

var arr = [1, 2].reduce(function(res, cur) { 
  res.push(cur + ''); 
  return res; 
}, []);
console.log(arr); // ["1", "2"]

到此，相信大家對“JavaScript數組reduce()方法怎么用”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！