在ES6中如何使用reduce方法

這篇文章將為大家詳細(xì)講解有關(guān)在ES6中如何使用reduce方法，小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

強(qiáng)大的reduce

數(shù)組的reduce方法用途很廣。它一般被用來把數(shù)組中每一項(xiàng)規(guī)約到單個(gè)值。但是你可以利用它做更多的事。

1 使用reduce同時(shí)實(shí)現(xiàn)map和filter

假設(shè)現(xiàn)在有一個(gè)數(shù)列，你希望更新它的每一項(xiàng)（map的功能）然后篩選出一部分（filter的功能）。如果是先使用map然后filter的話，你需要遍歷這個(gè)數(shù)組兩次。

在下面的代碼中，我們將數(shù)列中的值翻倍，然后挑選出那些大于50的數(shù)。有注意到我們是如何非常高效地使用reduce來同時(shí)完成map和filter方法的嗎？

const numbers = [10, 20, 30, 40];
const doubledOver50 = numbers.reduce((finalList, num) => { 
 num = num * 2;  
 if (num > 50) {
  finalList.push(num);
 } 
 return finalList;
}, []);
doubledOver50; // [60, 80]

2 使用reduce取代map和filter

如果你認(rèn)真閱讀了上面的代碼，你應(yīng)該能理解reduce是可以取代map和filter的。

3 使用reduce匹配圓括號(hào)

reduce的另外一個(gè)用途是能夠匹配給定字符串中的圓括號(hào)。對(duì)于一個(gè)含有圓括號(hào)的字符串，我們需要知道(和)的數(shù)量是否一致，并且(是否出現(xiàn)在)之前。

下面的代碼中我們使用reduce可以輕松地解決這個(gè)問題。我們只需要先聲明一個(gè)counter變量，初值為0。在遇到(時(shí)counter加一，遇到)時(shí)counter減一。如果左右括號(hào)數(shù)目匹配，那最終結(jié)果為0。

//Returns 0 if balanced.
const isParensBalanced = (str) => {
 return str.split('').reduce((counter, char) => {
  if(counter < 0) { //matched ")" before "("
   return counter;
  } else if(char === '(') {
   return ++counter;
  } else if(char === ')') { 
   return --counter;
  } else { //matched some other char
   return counter;
  }
  
 }, 0); //<-- starting value of the counter}
isParensBalanced('(())') // 0 <-- balanced
isParensBalanced('(asdfds)') //0 <-- balanced
isParensBalanced('(()') // 1 <-- not balanced
isParensBalanced(')(') // -1 <-- not balanced

4 統(tǒng)計(jì)數(shù)組中相同項(xiàng)的個(gè)數(shù)

很多時(shí)候，你希望統(tǒng)計(jì)數(shù)組中重復(fù)出現(xiàn)項(xiàng)的個(gè)數(shù)然后用一個(gè)對(duì)象表示。那么你可以使用reduce方法處理這個(gè)數(shù)組。

下面的代碼將統(tǒng)計(jì)每一種車的數(shù)目然后把總數(shù)用一個(gè)對(duì)象表示。

var cars = ['BMW','Benz', 'Benz', 'Tesla', 'BMW', 'Toyota'];
var carsObj = cars.reduce(function (obj, name) { 
  obj[name] = obj[name] ? ++obj[name] : 1;
 return obj;
}, {});
carsObj; // => { BMW: 2, Benz: 2, Tesla: 1, Toyota: 1 }

關(guān)于“在ES6中如何使用reduce方法”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，使各位可以學(xué)到更多知識(shí)，如果覺得文章不錯(cuò)，請(qǐng)把它分享出去讓更多的人看到。