Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

reduce方法的基本用法

  reduce方法是用于数组操作的一种方法,它不是JavaScript特有的,很多编程语言早就有这个方法了。它的功能是将数组计算成一个值,从字面上理解就是把数组“归纳”为一个值。然而这个求出的值也可以是对象类型,比如一个数组,所以是个非常强大的方法。
  最基本的用法就是一些需要遍历数组,并且需要临时变量的操作,比如求和、求积、求最大值、求最小值,等。比如下面这个例子
<script>
var s=[5,7,6,3,9,8,8,6,8];
var sum=s.reduce(function(a,b){
  return a+b;
}),max=s.reduce(function(a,b){
  return a>b?a:b;
}),min=s.reduce(function(a,b){
  return a<b?a:b;
});
console.log(sum,max,min); //60 9 3
</script>
  当然如果只需要这么简单的功能可以在Math对象中找到相应的方法,并使用apply来处理数组,这样效率会比reduce高。reduce方法的第一个参数需要一个函数,这个函数会对每一个数组元素执行,它有四个参数。第一个参数是上一次执行时候return的结果,第二个和第三个参数分别是当前数组元素的值和下标,最后一个是操作的数组自身对象。除了这些回调函数的参数外,reduce方法还有第二个参数,如果使用这个参数,reduce的首次回调执行就在首个元素上,将传入的第二个参数作为首次调用回调的参数。如果没使用这个参数,则reduce会从数组的第二个元素开始操作,第一个元素只作为首次调用回调时的参数。
  由于这个方法的参数挺多,文字描述起来有点让人费解,其实多看几个例子就能明白。下面是对cookie操作,直接取得key-value格式的cookie对象。
<script>
document.cookie="a=1";
document.cookie="b=2";
document.cookie="c=3";

//获取key-value格式的cookie
var result=document.cookie.split("; ").reduce(function(r,s){
  return s=s.split("="),r[s[0]]=s[1],r;
},{});

console.log(result);
</script>

  这样就节省了很多中间变量,一次性完成cookie的获取、切割、生成对象,等一系列操作。像这样从一个数组中计算出一个值的功能都适合用reduce实现。而且有时候甚至更复杂的东西都可以通过它来实现,比如排序(当然更对象直接用sort方法,这里就不演示了)。
  最后,数组对象的方法设计是没有要求操作对象必须是Array实例的。所以在DOM量巨大的Web中,对NodeList之类的拟数组数据也非常有用。
网名:
54.144.24.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^