天要吐槽下，我时不时地看到有些文章说“循环语句不好，你应该用 filter，map 和 reduce ”——每次看到有文章鼓吹，所有需要循环的场景一律用这几个函数式方法，我都恨得牙痒痒。

没错，这些函数式方法确实有它们的用途。我不是说你不能用它们，而是说不能不管三七二十一，到处滥用。在许多情况下，如果你想写性能好的代码，for 循环基本上是更好的选择。

map, filter 和reduce等方法的目的是防止传入的内容发生改变。在FP(函数式编程)风格中，向这些方法传递一个数组将返回一个新集合，而原始集合则保持不变。

对于map来说(因为它似乎是最容易被滥用和性能最差的)，与for循环相比，差异可能是显著的。原因是map将创建一个新的副本，在每次迭代时触发一个回调并消耗更多的内存。 for循环只是在执行迭代的内容，所以它几乎没有开销。

有人专门创建了一个仓库，将它们做了对比，对于大量数据的对比结果是惊人的(如果你知道这些方法的工作原理，你就一点也不觉得奇怪了)。

在我的 web应用中，我现在比以前更倾向于使用map, filter 和reduce。但我也注意到，在某些情况下，for循环是更好的选择，因为for循环可以做这些方法不能做的事情。

中止循环

你可能已经知道了，可以使用break关键字来中止for循环。如果使用for循环遍历数组，直到找到特定的值或运行了一定次数的迭代，就可以通过在循环中执行break来中止循环。

相反，map, filter 和reduce本身不能被终止；它们将一直迭代直到遍历完数组中的每一项。

异步循环

for循环可以很容易地与async/await一起使用，这意味着你可以暂停循环，让它等待一个promise被解决，然后再继续迭代下一个值。

当你尝试将async/await混合使用时，函数式方法map, filter 和reduce 将会产生混乱。如果 await累加器，你可以勉强让reduce 正常工作，但总感觉不太对劲。

for 循环就容易多了，所以为什么自找麻烦呢？而且，async/await 可以在各种形式的for循环里使用。

你还在干这种事吗？快住手

async function loadValues() {let myValues = await getValuesFromApi();myValues = myValues.map(value => {value.total = value.price * value.quantity;return value;});
}

有人用map遍历对象数组，只是为了修改数组里的对象属性值，然后又把整个结果赋值给原始数组，这种做法我见得太多了。map的本意其实是创建数组的一个副本，但是很多人把它当作循环来用，而且还把结果重新赋值给原来的变量，好歹用个新变量啊。

如果你也是这么做的，趁早纠正过来。用for循环就行了，因为那才是你本该做的。这种情况用map 你得不到任何好处。

总结

在大部分情况下，你用前面提到的任何一个函数式方法，在性能上跟传统的for循环相比几乎没有差别。如果不是处理几万、几十万条数据，性能差别不超过100ms。

先用你认为合适的方式去写代码，然后如果发现性能不够理想，你可以使用浏览器开发人员工具和常识来确定应用程序的哪些方面可以优化。

记住：过早的优化是万恶之源。

作者：1024译站
链接：https://www.jianshu.com/p/494ad0a7abba
来源：简书