在JavaScript函数式编程里使用Map和Reduce方法.docx

所有人都谈论道workflows支持ECMAScript6里出现的令人吃惊的新特性，因此我们很容易忘掉ECMAScript5带给我们一些很棒的工具方法来支持在JavaScript里进行函数编程，这些工具方法我们现在可以使用了。在这些函数方法里主要的是基于JavaScript 数组对象的map()方法和reduce()方法。如果你如今还没有使用/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/mapmap()和/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reducereduce()方法，那么现在是时候开始使用了。如今绝大部分的JavaScript开发平台都与生俱来的支持ECMAScript5。使用Map方法和reduce方法可以使你的代码更加简洁和更容易阅读和更容易维护，而且把你带到朝向更简洁的功能开发的路上。性能：一个警告当然，当现实状况需要保持提高性能时，你的代码的易读性和易维护性不得不在两者之间保持平衡。如今的浏览器使用更笨重的传统技术例如for循环来执行的更有效率。我写代码的方式通常是把可读性和可维护性放在编写代码的第一位，然后如果我发现在现实情况里代码运行出现了问题，再去为了提高性能而去优化代码。过早的优化代码是很困难的，而且这种优化会导致后面编写代码很困难。值得考虑的是在JavaScript引擎里使用诸如map()和reduce()这样的方法可以更好地改善代码的性能,而不是指望将来浏览器能为了改善性能而做出优化。除非我在一个性能问题上碰壁，要不然我更喜欢开心地写代码，然而以防我需要它们我却随时准备着为保持代码的性能而做出调整，尽管这样做使我的代码减少了吸引力。使用Map方法映射是一个基本的函数式编程技术，它对一个数组中的所有元素和创建的具有相同长度并有着转换内容的其他数组起作用。为了使刚才的说法更加具体一点，我想出了一个简单使用示例。例如，想象一下你有一个数组，数组里有字符数据，而且你需要把它们转换进另一个数组，这个数组里包含每一个字符数据的长度。(我知道，那没有复杂到火箭科学那种程度，这是你编写复杂的应用经常不得不去做的事情，但是理解它在一个简单示例例如这个里的工作原理将有助于你使用它，在这种情况下，你可以在你的代码里给它添加真实的数据值)。你也许知道刚才我描述的在一个数组上使用for循环如何做。它可能看起来像这样:var animals = [cat,dog,fish];var lengths = [];var item;var count;var loops = animals.length;for (count = 0; count loops; count++){ item = animals[count]; lengths.push(item.length);}console.log(lengths); //[3, 3, 4]所有我们需要做的事情是定义少量的变量：一个命名为animals的数组包含了我们需要的字符数据，一个命名为lengths的空数组将来用来包含我们操作数组数据输出的长度，和一个叫做item的变量，这个变量用来临时存储每一次循环遍历该数组时我们需要操作的数组项。我们定义了一个for循环，这个for循环有个内部变量和一个循环变量来初始化我们的for循环。然后我们循环迭代每一个项，直到迭代的数组长度等于animals数组的长度。每一次循环我们都计算迭代项的字符长度，然后把它保存到lengths数组里。注意：需要讨论的是我们可以把上面的代码写得更简洁些，不需要那个item变量,而直接把animals[count]的长度放到lengths数组里，这样就不需要中间的转换过程了。这样做可以帮我们省一点点代码空间，但是它也使得我们的代码有点不易阅读，即使是这个很简单的例子也一样。相同地，为了使代码更有效率而少些直白，我们可能会使用已知的animals数组长度来通过new Array(animals.length)的方式来初始化我们的lengths数组，然后通过索引而不是使用push方法来插入选项数据长度。这取决于你在现实中准备如何去使用这些代码。这种实现方式没有任何的技术错误。它在任何标准的JavaScript引擎里都可以用，并且它能很好的完成工作。一旦你知道怎么使用map()方法了，通过这种方法来实现就显得有些笨拙了。让我展示给你看使用map()方法是如何实现上面的代码的:var animals = [cat,dog,fish];var lengths = animals.map(function(animal) { return animal.length;})