Reduce()的深度 [英] Reduce() in depth

查看:102
本文介绍了Reduce()的深度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在ES5中,新的数组方法reduce().我想知道是否有人可以进一步解释.

In ES5, the new array method reduce(). I am wondering if someone can explain more in depth.

var test = [1, 2, 3, 4, 5].reduce(function(inital, item, idx) {
  return inital + item
}, 0);

console.log(test);

在此示例中,我们知道以下事实:初始参数为0,并使用回调函数循环通过.有人可以向我解释初始论证的范围吗?

In this example, we know for a fact that initial argument is 0 and loops through with callback function. Can someone explain it to me the scopes of initial argument?

如果我们假设[1、2、3、4、5]是从虚构方法返回的值,并且想要返回键为idx且值为Math.pow(idx,2)的对象形式. {1:1,2:4,3:9,4:16,5:25}.有人可以给我解释一下吗?

If we assume that [1, 2, 3, 4, 5] is what is returned from the imaginary method and want to return an object form which key is idx and value is Math.pow(idx,2). {1:1, 2:4, 3:9, 4:16, 5:25}. Can someone please explain it to me?

ALSO :) 我们有一个带有字母的数组.一些重复一些不重复.我想计算数组中有多少个字母并将其转换为对象形式. {a:5,.... z:7}; 有人请带我走过去.我了解forEach和map都很好,但是使用reduce方法,我很难解决这个问题.

ALSO :) we have an array with lettters. some repeats some don't. I want to count how many letters are are in an array and turn it into the object form. {a:5, .... z:7}; Someone please walk me through with it. I understand forEach and map just fine, but with the reduce method, I am having very difficult time getting my head around it.

提前谢谢

推荐答案

想象一下,我们的应用程序中有以下代码片段:

Imagine we have the following code snippet somewhere in our application:

function addLog() {
  console.log(arguments)
  return arguments[0] + arguments[1]
}

console.log([2,3,4].reduce(addLog))
console.log([2,3,4].reduce(addLog, 1))

不幸的是,我们依赖于名为badlibrary.js的库,该库将覆盖ES5的默认Array.prototype.reduce:

Unfortunately we have a dependency on a library called badlibrary.js which will overwrite ES5's default Array.prototype.reduce:

badlibrary.js:

badlibrary.js:

Array.prototype.reduce = Infinity

由于此库是我们应用程序的依赖项,因此我们无法删除该库.唯一的解决方案是在运行代码之前通过重写Array.prototype.reduce来修复它.

Since this library is a dependency for our application, we cannot remove the library. The only solution is to fix Array.prototype.reduce by rewriting it before we run our code.

事实证明,这并不困难.我们只需阅读有关reduce的Mozilla文档并将英语翻译为JavaScript.

It turns out that this is not so difficult. We can just read Mozilla's documentation on reduce and translate the English to JavaScript.

Array.prototype.reduce = function(callback, initialValue) {
  var resultSoFar, i
  var n = this.length
  if (typeof initialValue !== 'undefined') {
    resultSoFar = initialValue
    i = 0
  } else {
    resultSoFar = this[0]
    i = 1
  }
  for (; i < n; i++) {
    resultSoFar = callback(resultSoFar, this[i], i, this)
  }
  return resultSoFar
}

即使使用此自定义版本的reduce,我们的代码现在也可以使用,并且现在reduce不再是黑匣子".如果愿意,我们可以轻松地自己编写它,实际上,这是ES5标准化之前几个人所做的事情.顺便说一句,有些人仍然使用仅支持ES3的浏览器.为了使reduce与跨浏览器真正兼容,我们仍然需要对其进行填充或使用Underscore/Lodash/Ramda这样的实用程序库.使用实用程序库是IMO,这是最好,最简单的解决方案.

Our code now works, even with this custom version of reduce, and now reduce is no longer a "black box". We could easily write it ourselves if we wanted to, and in fact, that is what several people did before ES5 was standardized. By the way, some people still use browsers that only support up to ES3. For reduce to be truly cross-browser compatible, we still need to shim it or use a utility library like Underscore/Lodash/Ramda. Using a utility library is IMO, the best and easiest solution.

ALSO :)我们有一个带有letters的数组.一些重复一些不重复.一世 想计算数组中有多少个字母并将其转换为 对象形式. {a:5,.... z:7};有人请引导我 它.我了解forEach和map都很好,但是减少了 方法,我很难解决这个问题.

ALSO :) we have an array with lettters. some repeats some don't. I want to count how many letters are are in an array and turn it into the object form. {a:5, .... z:7}; Someone please walk me through with it. I understand forEach and map just fine, but with the reduce method, I am having very difficult time getting my head around it.

我们要返回的是一个JS对象,其字母为键,其计数为值.我们在reduce函数中将此值称为resultSoFar,我们将通过在数组的每个元素上调用函数来建立该值.我们的初始值应该是一个空对象.在我们的函数中,我们将采用当前字母并尝试将其计数加1.如果这产生NaN(如果计数未定义,即当我们第一次看到一个字母且尚未分配计数时,会发生这种情况),则应将值赋给1,因为它的新字母是数,我们看到了其中之一.

The thing we want to return is a JS object with the letters as the keys and their counts as the values. We called this value resultSoFar in our reduce function and we are going to build that value up by calling our function on each of the elements of the array. Our initial value should be an empty object. In our function, we'll take the current letter and try to add 1 to its count. If this produces NaN (which will happen if the count is undefined i.e. when we are seeing a letter for the first time and no count has been assigned yet), then we should assign the value to 1 instead since its a new letter to count and we're seeing one of them.

牢记这一理论,计数代码可以编写如下:

With this theory in mind, the counting code can be written as follows:

var letters = ['a', 'b', 'c', 'a', 'b', 'a']
console.log(letters.reduce(function(counts, currentLetter) {
    var currentLetterCount = counts[currentLetter]
    counts[currentLetter] = currentLetterCount + 1 || 1
    return counts
  }, {}))

这篇关于Reduce()的深度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆